web-dev-qa-db-fra.com

React Native - Pouvons-nous partager une image et du texte dans WhatsApp?

J'ai passé des heures à trouver un moyen d'envoyer/partager une image (et du texte si possible) dans l'application WhatsApp à l'aide de réagit natif,

J'ai lu cette question (sous Android) et cette question (en utilisant des liens)

sur Android, il est possible d’envoyer des images et du texte à WhatsApp, mais je ne vois aucun moyen de les archiver en natif,

quelqu'un a une idée?

3
flix

Pour les versions natives de réaction supérieures à 0.56.0, la fonctionnalité de partage social est déjà implémentée dans la bibliothèque. Par conséquent, des bibliothèques supplémentaires telles que réact-native-share ne sont plus nécessaires et peuvent ne pas être maintenues. En fait, j’utilisais la bibliothèque react-native-share il y a quelques mois pour les anciennes versions de react-native et j'ai migré le code correspondant vers l'implémentation de ce dernier qui exporte une classe Share dotée du partage méthode et il est très facile à utiliser.

Ensuite, vous pouvez utiliser la méthode partager pour partager des données et réagir en natif saura quelles applications le téléphone est installé. Dans l'image suivante, vous pouvez voir à quoi ressemble l'écran de partage dans un téléphone Android avec l'application WhatsApp installée: enter image description here

Et voici comment il voudrait dans un simulateur iOS sans application installée: enter image description here

Ici vous pouvez trouver un exemple de code:

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>
    );
  }
}

Enfin, vous avez le choix entre différentes options pour envoyer le image + texte message: - Vous pouvez utiliser le champ url de l’option shareOptions pour ajouter l’URI distant de l’image afin qu’elle puisse être visualisée dans le message WhatsApp. et le titre ou les champs d'objet pour ajouter le texte. - Vous pouvez partager une URL de fichier base64 comme celle-ci: url: 'data:image/png;base64,<base64_data>'

5

Vous pouvez utiliser react-native-multi-share si vous souhaitez partager plusieurs images en même temps :)

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

0
Alex Lévy