我想分享这个JSON数据当用户点击分享按钮

Question

这是JSON DATA

{
  "sad": [
    { "id": "1", "title": "hello this is no.1" },
    {
      "id": "2",
      "title": "आँखें थक गई है आसमान को देखते देखते पर वो तारा नहीं टूटता ,जिसे देखकर तुम्हें मांग लूँ"
    },
    {
      "id": "3",
      "title": "मेरी हर आह को वाह मिली है यहाँ…..,कौन कहता है दर्द बिकता नहीं है !"
    },
    {
      "id": "4",
      "title": "तुझसे अच्छे तो जख्म हैं मेरे । उतनी ही तकलीफ देते हैं जितनी बर्दास्त कर सकूँ"
    },
    {
      "id": "5",
      "title": "रुठुंगा अगर तुजसे तो इस कदर रुठुंगा की ये तेरीे आँखे मेरी एक झलक को तरसेंगी !!"
    },
    {
      "id": "6",
      "title": "बेवफा लोग बढ़ रहे हैं धीरे धीरे, इक शहर अब इनका भी होना चाहिए"
    },
    {
      "id": "7",
      "title": "बेवफा लोग बढ़ रहे हैं धीरे धीरे, इक शहर अब इनका भी होना चाहिए"
    },
    {
      "id": "8",
      "title": "बेवफा लोग बढ़ रहे हैं धीरे धीरे, इक शहर अब इनका भी होना चाहिए"
    },
    {
      "id": "9",
      "title": "बेवफा लोग बढ़ रहे हैं धीरे धीरे, इक शहर अब इनका भी होना चाहिए"
    }
  ]
}

这是我的代码，我想知道当用户按下共享按钮

时我应该如何共享这些数据这里导入了所有库

import React, { Component, useState, useEffect } from "react";
import {
  StyleSheet,
  View,
  Text,
  FlatList,
  ListView,
  TouchableOpacity,
  Share,
} from "react-native";
import Icon from "react-native-vector-icons";
import SadJson from "./sad.json";
var d = SadJson.sad;
const sad = ({ navigation }) => {
  const [data, setData] = useState([]);
  // This is share method code
  const onShare = async () => {
    try {
      const result = await Share.share({
        message: data.toString(d),
      });
    } catch (error) {
      alert(error.message);
    }
  };
  useEffect(() => {
    setData(d);
  });
  // This is return section where I use Flatlist for show Data
  return (
    <View style={styles.container}>
      <FlatList
        data={data}
        removeClippedSubviews={false}
        renderItem={({ item }) => (
          <View>
            <Text>
              {item.id}
              {item.title}
            </Text>
            <View style={{ flexDirection: "row" }}>
              <TouchableOpacity style={styles.sharebtn} onPress={onShare}>
                <Text>Share{item.id}</Text>
              </TouchableOpacity>
              <TouchableOpacity style={styles.sharebtn}>
                <Text>Copy</Text>
              </TouchableOpacity>
            </View>
          </View>
        )}
      />
    </View>
  );
};
// This is Style section
const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: "center",
  },
  sharebtn: {
    width: 60,
    height: 30,
    padding: 5,
    backgroundColor: "#2BDB25",
    borderRadius: 10,
  },
  btntext: {
    textAlign: "center",
  },
});
export default sad;

请帮助我，请让我知道如何在社交媒体或任何其他应用程序上分享这些数据

Answer 1

如果我正确理解了您的问题，您想要共享来自data state的特定数据元素。要将特定对象从data传递给Share.share，那么我建议您将整个item对象从FlatList中的映射回调传递给onShare处理程序。

更新onShare以消费item对象。此外，由于您实际上并不使用等待返回值，因此该函数可能不需要是async(如果您确实使用await值，则可以将其添加回来)。

const onShare = item => {
  try {
    const result = await Share.share({
      message: item,
    });
  } catch (error) {
    alert(error.message);
  }
};

并将item传递给回调

<TouchableOpacity
  style={styles.sharebtn}
  onPress={() => onShare(item)} // <-- pass item to callback
>
  <Text>Share{item.id}</Text>
</TouchableOpacity>

另一个建议-因为你的数据是静态的，没有太多的需要从useEffect钩子填充你的状态，特别是因为这个效果没有任何依赖和更新状态，除非你有一个复制/粘贴问题，写这个效果看起来像它应该触发渲染循环。你可以用一个初始值填充你的状态。

const d = SadJson.sad;
...
const [data, setData] = useState(d); // <-- initialize state with the imported JSON data