Social Libs

신사업개발실 원더FE개발팀 소셜 공유 라이브러리

This project was generated by Vessel.

About

공유하기 모듈: 카카오톡

Installation

해당 모듈을 사용할 프로젝트에서는 아래와 같이 설치한다.

$ npm install --save @newbiz/social-libs
or
$ yarn add @newbiz/social-libs

Usage

최초 랜더링 되는 앱에 아래와 같이 초기화를 실행해주고, 사용되는 컴포넌트에서 옵션 설정을 파라미터로 전달하면 된다.

ex)

import { KakaoShare } from '@newbiz/social-libs'

const kakaoShare = new KakaoShare("APP_JAVASCRIPT_KEY")

kakaoShare.createTextButton({ OPTIONS }) // 실행 할 메소드와 옵션

Modules

해당 모듈은 아래와 같은 라이브러리를 포함한다.

KakaoShare

Methods

카카오톡 공유 버튼 생성은 각 형태에 맞는 옵션을 지정하여 아래 메소드를 이용한다. 각 형태에 대한 option은 interface 정의를 참고한다.

Feed 형태 버튼 생성

public createFeedButton (options)

List 형태 버튼 생성

public createListButton (options)

Location 형태 버튼 생성

public createLocationButton (options)

Commerce 형태 버튼 생성

public createCommerceButton (options)

Text 형태 버튼 생성

public createTextButton (options)

URL Scrap 형태 버튼 생성

public createScrapButton (options)

커스텀 템플릿을 이용한 형태 버튼 생성

public createCustomButton (options)

Options

형태별 상세 옵션은 라이브러리내 interface 정의 파일을 참고. 공통 옵션 포함하여 위 메소드 형태와 동일한 옵션을 지정하여 option parameter를 메소드에 제공하면 된다.

interface IKakaoOption {
  // 공통
  container: string; // DOM Element 또는 Element의 ID Selector를 넘기면, 해당 Element를 클릭할 때 카카오링크가 전송됩니다.
  buttons?: [{ // 버튼, 링크 설정 가능
    title: string;
    link: IKakaoLinkUrl;
  }];
  isInstallTalk?: boolean; // 카카오톡이 설치되어 있지 않은 경우 마켓의 카카오톡 설치 페이지로 이동합니다.
  onSuccess? (message: object): void;
  onFailure? (): void;

  // feed, link, location, commerce, text, scrap, custom 타입별 옵션
  feed?: IKakaoFeedType;
  list?: IKakaoListType;
  location?: IKakaoLocationType;
  commerce?: IKakaoCommerceType;
  text?: IKakaoTextType;
  scrap?: IKakaoScrapType;
  custom?: IKakaoCustomType;
}

License

해당 프로젝트의 LICENSE 파일 참조.