如何在react native中显示来自两个不同键值的过滤JSON数据

时间:2017-09-10 06:38:50

标签: javascript json react-native

这是我的JSON数据

{
  "profile": [
    {
      "proid": {
        "user": "kohinoor"
      },
      "image": "/media/profiles/DSCN3253.JPG",
      "shoptype": "Clothes",
      "city": "Ahemednagar"
    },
    {
      "proid": {
        "user": "shrawani"
      },
      "image": "/media/profiles/PicsArt_08-17-09.24.48_qA94ILU.jpg",
      "shoptype": "Cat Shop",
      "city": "Kopargaon"
    },
    {
      "proid": {
        "user": "rajpal"
      },
      "image": "/media/profiles/PicsArt_08-17-09.24.48_T3birjf.jpg",
      "shoptype": "Clothings",
      "city": "Sangamner"
    },
  ],
  "post": [
    {
      "id": 120,
      "content": "Old Mi Stocks or Sell !!!",
      "url": null,
      "shareproductdealer": "kohinoor",
      "shareproducttype": "Xiaomi Mi",
      "shareproductid": "68",
      "username": "kohinoor",
      "updated": "2017-09-08T10:49:11Z",
      "timestamp": "2017-09-08T10:49:11Z"
    },
    {
      "id": 119,
      "content": "Hello... Miahe...",
      "url": null,
      "shareproductdealer": null,
      "shareproducttype": null,
      "shareproductid": null,
      "username": "shrawani",
      "updated": "2017-09-08T10:38:14Z",
      "timestamp": "2017-09-08T10:38:14Z"
    },
    {
      "id": 115,
      "content": "hello jockey",
      "url": null,
      "shareproductdealer": "rajpal",
      "shareproducttype": "jockey",
      "shareproductid": "65",
      "username": "rajpal",
      "updated": "2017-08-16T11:22:32Z",
      "timestamp": "2017-08-16T11:22:32Z"
    }
  ]
}

在此数据中,有两个关键值profilepost

我想通过查看来自个人资料的profile和来自帖子的post来显示user中来自username的相应数据的数据。意味着我想从个人资料中添加数据和相应的帖子数据。

这是我的反应原生代码

constructor(props) {
    super(props);
    this.state = {
      results: {
        isLoading: true,
        profile: [],
          user:'',
            proid: '',
            image: '',
            shoptype: '',
            city: '',
        post: [],
          username: '',
            content: '',
            url: '',
            timestamp: '',
            id: '',
      }
    };
    this.fetchData = this.fetchData.bind(this);
  }

渲染方法

render() {
    contents = this.state.results.post.map((item) => {
      return (
          <View key={item.id}>
            <Text>
              {item.id}
            </Text>
            <Text>
              {item.username}
            </Text>
            <Text>
              {item.timestamp}
            </Text>
            <Text>
              {item.content}
            </Text>
          </View>
        );
     });
    return (
      <ScrollView>
        {contents}
      </ScrollView>
    );
  }

这仅打印帖子中的所有数据。没有根据需要整合相应的数据。

那么如何通过检查这两个值来实现各个数据的过滤呢?请帮忙......

1 个答案:

答案 0 :(得分:2)

试试这个解决方案。使用Array#map迭代配置文件,并为每个项目创建一个新对象,该对象由配置文件本身和帖子组成,使用Array#filter过滤相应的帖子。然后在您的React代码中显示此数据。

Javascript示例。

&#13;
&#13;
[DllImport("user32.dll", EntryPoint = "FindWindowEx")]
public static extern IntPtr FindWindowEx(IntPtr hwndParent, IntPtr hwndChildAfter, string lpszClass, string lpszWindow);
[DllImport("User32.dll")]
public static extern int SendMessage(IntPtr hWnd, int uMsg, int wParam, string lParam);
string processName = "notepad";

    Process [] notepads=Process.GetProcessesByName("notepad");
    if(notepads.Length==0)return;            
    if (notepads[0] != null)
    {
        IntPtr child= FindWindowEx(notepads[0].MainWindowHandle, new IntPtr(0), "Edit", null);
        SendMessage(child, 0x000C, 0, "Hello");
    }
&#13;
&#13;
&#13;