如何使用 React-Native 使用这个 Json？ [关闭]答案

【问题标题】：How Can I consume this Json using React-Native? [closed]如何使用 React-Native 使用这个 Json？ [关闭]
【发布时间】：2019-08-09 05:02:33
【问题描述】：

我想知道如何使用和使用这个 json，总是显示和更新列表，我的工作需要这个，我正在努力做到这一点。

HERE THE JSON

【问题讨论】：

不要贴代码截图...放这里。
向我们展示您尝试过的内容，我们或许可以提供帮助，但就目前的情况而言......目前还不清楚您要做什么。

标签： javascript react-native

【解决方案1】：

就像在 React 中一样。首先你应该获取数据（通常componentDidMount() 是一个很好的地方。你需要更新组件的状态以包含获取的数据。这是一个使用axios 的示例，但使用@987654323 可以达到相同的效果@API。

class MyComponent extends Component {
    state = {
        data : []
    }

    componentDidMount(){
        axios.get('myendpoint')
              .then(res => this.setState({data : res}))
    }

    render(){
        const { data } = this.state

        return(
            <FlatList
                data={data}
                renderItem={({item}) => <Text>{item}</Text>}
            />
        )
    }

}

与fetch

class MyComponentWithFetch extends Component {
    state = {
        data : []
    }

    componentDidMount(){
        fetch('myendpoint')
            .then(docs => docs.json())
            .then(res => this.setState({data : res}))
    }

    render(){
        const { data } = this.state

        return(
            <FlatList
                data={data}
                renderItem={({item}) => <Text>{item}</Text>}
            />
        )
    }
}

ps：别忘了钥匙

【讨论】：

我没有关注... data.map 不是 react-native 的方法，我遇到了几个错误，我该如何使用平面列表？请
map 是一个数组/对象内置的 javascript 函数，因此可以在任何地方使用 javascript。 map 方法期望一个集合作为参数和一个回调函数，该函数将在每个项目中调用。我在我的示例中使用生成多个列表项，类似于 Flatlist 的 renderItem。我会将我的示例更新为 flatlist