React Native - 我们可以将图像和文本共享到whatsapp吗？

Question

我花了一个小时的时间来找到一种方法来发送/共享图像（如果可能的话，还有文本）使用本机反应来进入whatsapp应用程序，

我已阅读this question（在android中）和this question（使用链接）

在android上，可以将图像和文本发送到whatsapp，但是在本机上我没有看到任何方法来实现它，

有人有想法吗？

Answer 1

对于本机版本大于0.56.0的社区共享功能已经在库中实现，因此不再需要诸如react-native-share之类的额外库，并且它们可能无法维护。实际上，几个月前，我在旧版本的react-native中使用了react-native-share库，并将相应的代码迁移到了react-native实现中，该实现导出了具有share方法的Share类。非常容易使用。

然后，您可以使用share方法共享数据，React-native会知道安装了手机的应用程序。在下图中，您可以看到共享屏幕在装有WhatsApp应用程序的Android手机中的外观：

这是在未安装任何应用的iOS模拟器中的样子：

在这里您可以找到代码示例：

import React, { Component } from 'react';
import {
  Share,
  Text,
  TouchableOpacity
} from 'react-native';

const shareOptions = {
  title: 'Title',
  message: 'Message to share', // Note that according to the documentation at least one of "message" or "url" fields is required
  url: 'www.example.com',
  subject: 'Subject'
};

export default class ShareExample extends React.Component {

  onSharePress = () => Share.share(shareOptions);

  render(){
    return(
      <TouchableOpacity onPress={this.onSharePress} >
        <Text>Share data</Text>
      </TouchableOpacity>
    );
  }
}

最后，您必须选择发送图片+文字消息的选项： -您可以使用shareOptions的url字段添加图像的远程URI，以便可以在WhatsApp消息中进行预览，并可以使用title或subject字段来添加文本。 -您可以像这样共享base64文件网址： url: 'data:image/png;base64,<base64_data>'

Answer 2

如果您希望同时共享多张图片，可以使用react-native-multi-share

https://github.com/chuangbo/react-native-multi-share

Answer 3

我使用的是react native 0.59版本，但仍然无法在whatsapp上共享图像和文本（包括链接），因为默认的react native共享要么是message要么是url需要使用react-native-shared库https://github.com/react-native-community/react-native-share。我还使用rn-fetch-blob库将图像url转换为base64图像数据。

shareImage= () => {
RNFetchBlob.fetch('GET', `https://example.com/example.png`)
  .then(resp => {
    console.log('response : ', resp);
    console.log(resp.data);
    let base64image = resp.data;
    share('data:image/png;base64,' + base64image);
  })
  .catch(err => errorHandler(err));

share = base64image => {
  console.log('base64image : ', base64image);
  let shareOptions = {
    title: 'Title',
    url: base64image,
    message: 'https://somelink.com some message',
    subject: 'Subject'
  };

  Share.open(shareOptions)
    .then(res => {
      console.log(res);
    })
    .catch(err => {
      err && console.log(err);
    });
};

};