React Native: 공유 기능 구현하기, Share Component

안-녕.
오늘은 공유하기를 만들어볼거야.

share()라는 메서드를 이용하면 뚝딱 만들뚜이떠!
share()에게 필요한 인자는 2개인데 content, options야.
options은 써도되고 안써도되고...

🔸 바인드 시킬 버튼을 만들어보까

<Text onPress={() => onShare()}>공유하기</Text>

'공유하기'를 클릭하면 onShare가 동작하게 해놨어.

🔸 이제 onShare를 만들꼬얌

const onShare = async () => {
    try {
      const result = await Share.share(
        {
          message: '공유에 보이는 메세지 이거를 복붙할 수도 있엉!',
        } 
      );

      if (result.action === Share.sharedAction) {
        if (result.activityType) {
          console.log('activityType!');
        } else {
          console.log('Share!');
        }
      } else if (result.action === Share.dismissedAction) {
        console.log('dismissed');
      }
    } catch (error) {
      alert(error.message);
    }
  };

오왕. 끝나쩡!
나는 이걸루 앱을 공유하는 다이얼로그를 만들건데
그럴려면, 플랫폼별로 연결 시킬 스토어를 만들어줘야되겠지?

 const link =
    Platform.OS === 'ios'
      ? 'https://apps.apple.com/us/app/%EB%B3%B4%EB%8B%A5-%EB%82%B4-%EB%B3%B4%ED%97%98%EC%A0%90%EC%88%98-%EC%A7%84%EB%8B%A8-%EC%83%88%EB%8A%94-%EB%B3%B4%ED%97%98%EB%A3%8C-%ED%99%95%EC%9D%B8/id1447862053'
      : 'https://play.google.com/store/apps/details?id=com.mrp.doctor&hl=ko';

나는 이렇게 해놨어 ⤴
그럼, 이제 message의 값에 link를 넣어주면 되겠즹!

 const result = await Share.share(
        {
          message: link,
        }
      );

 

✳ 결과 이미지:

 

참고로...
content에는 message, url, title 이렇게 있는데 말이야.
url은 IOS 단독! title은 Android 단독이야.

message 혹은 url은 둘 중에 하나는 꼭 써야돼!
그리고 dismissedAction도 IOS 단독이양.

공유하기 기능 구현 참 쉽쥐?
그롬 안뇽!