DEV Community

Cover image for Share files on React Native
Gabriel Rufino
Gabriel Rufino

Posted on

Share files on React Native

File sharing is a very common feature in many apps. For this purpose on React Native, we can use the lib React Native Share.

Install React Native Share

$ npm install react-native-share --save
Enter fullscreen mode Exit fullscreen mode

One more step for iOS

$ npx pod-install
# or
$ cd ios && pod install
Enter fullscreen mode Exit fullscreen mode

Share a file

import React, {useCallback} from 'react';
import {View, Button} from 'react-native';
import Share from 'react-native-share';

export default function ShareAudio () {
  const onShareAudio = useCallback(function () {
    Share.open({
      url: `file:///data/data/com.yourapp/files/audio.mp3`,
      type: 'audio/mp3',
    });
  }, []);

  return (
    <View>
      <Button
        title="Share audio"
        onPress={onShareAudio}
      />
    </View>
  );
};
Enter fullscreen mode Exit fullscreen mode

Discussion (4)

Collapse
kumard3 profile image
Kumar Deepanshu

so i have a Question , I am planning to build an file transfer app , which share files between applications , and save it to the local file system , just like Share It ,
so can i use react-native-share for that purpose .

Collapse
rajajaganathan profile image
Raja Jaganathan • Edited on

Thanks for writing up!

Collapse
gabrielrufino profile image
Gabriel Rufino Author

Thank you for your feedback :D

Collapse
aftabaminzoobiapps profile image
aftabaminzoobiapps

How to share a video. can you help me please.