React Native 中的列表不显示
List in react native is not displayed
我想在 React Native 中显示一个列表,但屏幕上显示的是:
item.name item.name item.name item.name item.name
如果我将鼠标悬停在 'item' 上,它会显示
'item' is declared but its value is never read.
如果我删除 Text 标签,那么 item 是可见的,但无法显示名称,因为它必须被文本包围标签。
import React, { Component } from 'react';
import { StyleSheet,Text, View,TouchableOpacity,AsyncStorage,FlatList } from
'react-native';
import { createStackNavigator} from "react-navigation"
export default class ListPage extends Component {
render(){
const { navigation } = this.props;
return (
<View style={styles.container}>
<FlatList
data = {[{name:'bob'},{name:'bob'},{name:'bob'},{name:'bob'},{name:'bob'}]}
keyExtractor={(x,i) => i.toString()}
renderItem={({ item }) =>
<Text>item.name</Text>
}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#95a5a6',
},
})
您的数据是一个对象数组。您忘记用大括号将 renderItem 函数括起来。应该是:
renderItem={({ item }) =>
<Text>{item.name}</Text>
而不是:
renderItem={({ item }) =>
<Text>item.name</Text>
我想在 React Native 中显示一个列表,但屏幕上显示的是:
item.name item.name item.name item.name item.name
如果我将鼠标悬停在 'item' 上,它会显示
'item' is declared but its value is never read.
如果我删除 Text 标签,那么 item 是可见的,但无法显示名称,因为它必须被文本包围标签。
import React, { Component } from 'react';
import { StyleSheet,Text, View,TouchableOpacity,AsyncStorage,FlatList } from
'react-native';
import { createStackNavigator} from "react-navigation"
export default class ListPage extends Component {
render(){
const { navigation } = this.props;
return (
<View style={styles.container}>
<FlatList
data = {[{name:'bob'},{name:'bob'},{name:'bob'},{name:'bob'},{name:'bob'}]}
keyExtractor={(x,i) => i.toString()}
renderItem={({ item }) =>
<Text>item.name</Text>
}
/>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#95a5a6',
},
})
您的数据是一个对象数组。您忘记用大括号将 renderItem 函数括起来。应该是:
renderItem={({ item }) =>
<Text>{item.name}</Text>
而不是:
renderItem={({ item }) =>
<Text>item.name</Text>