Question

我需要在数组数据下方显示为渲染函数：
我知道如何循环数据并在渲染中显示。

[{ profileid: 1, enabled: 1, attachment: '', id: 233, topicid: 47, tstamp: 'January, 21 2016 15:06:31 +1100', body: 'to check orders' }, { profileid: 2, enabled: 1, attachment: '', id: 233, topicid: 47, tstamp: 'January, 21 2016 15:06:31 +1100', body: 'to check orders' } ]

Answer 1

这是一个例子。

import React from 'react'
import { View, Text } from 'react-native'
...
const data = [{
    profileid: 1,
    enabled: 1,
    attachment: '',
    id: 233,
    topicid: 47,
    tstamp: 'January, 21 2016 15:06:31 +1100',
    body: 'to check orders'
}, {
    profileid: 2,
    enabled: 1,
    attachment: '',
    id: 233,
    topicid: 47,
    tstamp: 'January, 21 2016 15:06:31 +1100',
    body: 'to check orders'
} ]
...
render() {

    return (
        <View>
            {data.map((dataItem) =>
                <View key={dataItem.profileid}>
                    <Text>{dataItem.profileId}</Text>
                    <Text>{dataItem.enabled}</Text>
                    <Text>{dataItem.attachment}</Text>
                    <Text>{dataItem.id}</Text>
                    <Text>{dataItem.topicid}</Text>
                    <Text>{dataItem.tstamp}</Text>
                    <Text>{dataItem.body}</Text>
                </View>
            )}
        </View>
    )

}

Answer 2

我希望我帮助你

 class Parent extends  React.Component{
        constructor(props){
            super(props);
            this.state = {
                gists : []
            }
        }

        componentDidMount() {
            fetch('http://rest.......')
                .then(response => response.json())
                .then(gists => this.setState({ gists }))
        }


        render(){
             return (
                 <ul>
                     {this.state.gists.map(gist => (
                         <li key={gist.countryId}>{gist.name}</li>
                     ))}
                 </ul>
             )
        }
    }

Parent.propTypes = {
    data: React.PropTypes.array
}

在本机中如何将fetch响应数组对象追加到渲染函数中？

2 个答案: