React native 反应与';t显示array.map详细信息
我正在尝试使用.map显示用户列表,但是我在屏幕上看不到任何东西(仅看到第一条消息Hello React Native),并且没有收到任何错误。我尝试在控制台中显示用户列表,并且用户正确地出现在控制台中 这是代码React native 反应与';t显示array.map详细信息,react-native,React Native,我正在尝试使用.map显示用户列表,但是我在屏幕上看不到任何东西(仅看到第一条消息Hello React Native),并且没有收到任何错误。我尝试在控制台中显示用户列表,并且用户正确地出现在控制台中 这是代码 import React, {Component} from 'react'; import {View, Text} from 'react-native'; type Props = {}; export default class App extends Component&l
import React, {Component} from 'react';
import {View, Text} from 'react-native';
type Props = {};
export default class App extends Component<Props> {
constructor(props){
super(props)
this.state = {
users: []
}
}
componentWillMount() {
this.setState({
users: [{
name: 'Name 1',
},
{
name: 'Name 2',
}, {
name: 'Name 3',
}
]
})
}
render() {
return (
<View style={{ flex: 1 }}>
<Text>Hello React Native</Text>
{this.state.users.map(user => {
{console.log(user)} // Displaying the users properly in the console.
<View>
<Text>
{user.name}
</Text>
</View>
})}
</View>
);
}
}
import React,{Component}来自'React';
从“react native”导入{View,Text};
类型Props={};
导出默认类应用程序扩展组件{
建造师(道具){
超级(道具)
此.state={
用户:[]
}
}
组件willmount(){
这是我的国家({
用户:[{
名称:“名称1”,
},
{
名称:“名称2”,
}, {
名称:“名称3”,
}
]
})
}
render(){
返回(
你好,我是本地人
{this.state.users.map(user=>{
{console.log(user)}//在控制台中正确显示用户。
{user.name}
})}
);
}
}
函数.map
中缺少return
语句,您必须添加该语句
render() {
return (
<View style={{ flex: 1 }}>
<Text>Hello React Native</Text>
{this.state.users.map((user, index)=> {
{console.log(user)} // Displaying the users properly in the console.
return (
<View key={index}>
<Text>
{user.name}
</Text>
</View>
)
})}
</View>
);
}
render(){
返回(
你好,我是本地人
{this.state.users.map((用户,索引)=>{
{console.log(user)}//在控制台中正确显示用户。
返回(
{user.name}
)
})}
);
}
希望这会有帮助