首页 > 解决方案 > 在本机反应中呈现 JSON 数据

问题描述

我目前正在使用我的 api 以 JSON 格式呈现所有帖子以做出本机反应。但我不断收到这个未定义的错误。有时数据只是不会呈现。任何人都可以帮助我在本机反应中呈现这些数据吗?并向我解释我做错了什么?我对 JSON 很陌生。谢谢 :)

这是我的 JSON:

{"data":[{"id":"1","type":"posts","links":{"self":"https://example.com/posts/1"},"attributes":{"title":"Laughter Post","context":{}},"relationships":{"user":{"links":{"self":"https://example.com/posts/1/relationships/user","related":"https://example.com/posts/1/user"}}}}]}

这是我的反应本机代码:

import React, { Component } from "react";
import { FlatList, StyleSheet, Text, View } from "react-native";

export default class App extends Component {
state = {
data: []
};

componentWillMount() {
this.fetchData();
}

fetchData = async () => {
const response = await fetch("https://example.com/posts.json");
const json = await response.json();
this.setState({ data: json.data });
};

render() {
  return (
    <View style={styles.container}>
     <FlatList
      data={this.state.data}
      keyExtractor={item => item.toString()}
      renderItem={({ item }) =>
        <Text>
          {`${item.title}`}
        </Text>}
       />
    </View>
   );
  }
 }

 const styles = StyleSheet.create({
 container: {
 marginTop: 15,
 flex: 1,
 justifyContent: "center",
 alignItems: "center",
 backgroundColor: "#F5FCFF"
 }
 });

标签: ruby-on-railsreact-native

解决方案


看来您是title直接从根访问,但它是里面的关键attributes

它应该是

{`${item. attributes.title}`}

或者,如果您能告诉我们确切的错误,我们可以为您提供有关此问题的更多帮助。


推荐阅读