Question

我需要在<Text>中绘制一个数组。这就是我在render()

中得到的

categories.map(category => <Text>{category.testHeader}</Text>

但它没有打印任何东西。我想<Text>需要render()吗？所以我尝试在render中调用的函数中添加它。像这样：

function myfunc() {
    return categories.map(category => <Text>{category.testHeader}</Text>)
}

然后在render()：

<View>
    {myfunc()}
</View>

然后编译器说“无法读取属性＆＃39; map＆＃39;未定义的。所以提示告诉我写：

function myfunc() {
    if (this.props.data) {
        return categories.map(category => <Text>{category.testHeader}</Text>)
    }
}

但是现在编译器告诉我data未定义。不知道该怎么办......：/

Answer 1

您可以这样使用：

var categories = [{ id: 0, text: 'hasan' }, 
    { id: 1, text: 'erkan' },
    { id: 2, text: 'veli' }];

export default class App extends Component {
renderCategories() {
    return categories.map((item, index) => <Text key={index}>{item.text}</Text>);
}
render() {
    return (
        <View style={styles.container}>
            {this.renderCategories()}
        </View>
    );
}

}

Answer 2

首先将数据定义为[]。然后将类别数组分配给数据并尝试使用它。如果需要，请使用JSON.parse（data）

如何将数组正确映射到<text>（React native）

2 个答案: