平面列表未显示数据

Question

我正在用ReactNative和Expo构建应用程序，我想用Flatlist显示数据，我从外部文件导入数据。上面没有错误，但数据没有显示在屏幕上，屏幕为空。

import { GestureHandlerRefContext } from '@react-navigation/stack';
import Rect,{ useState }  from 'react';
import {View, Text,FlatList, StyleSheet,SafeAreaView} from 'react-native';
import Data from '../utils/Data'
import {PanGestureHandler, PanGestureHandlerGestureEvent} from 'react-native-gesture-handler';
import Animated, { useAnimatedGestureHandler, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
const RequestsBody =() => {

return (      
<SafeAreaView>
<FlatList
data={Data}
keyExtractor={(item) => item.id}
renderItem={({item}) => 
<View>
<Text>{item.name}</Text>
<Text>{item.zone}</Text>
<Text>{item.activities}</Text>
</View>
}
/>
</SafeAreaView>
)}

export default RequestsBody; 

注意：我想以正确的方式构建平面列表，这样我就可以使用Reanimated和handler以及GestureHandler。我想在平面列表项目上进行动画效果滑动删除

Answer 1

例如

function App(){
const data = ["item", "item2", "item3"];
return (
<FlatList data={data} renderItem={({item}) => (
<Text>{item} </Text>
)} />
)
}
export default

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

注意FlatList处理这样的数据如果数据是对象数组，例如：const data＝[｛name："basit"｝，｛name:"Joseph"｝；

平面列表将获取通过道具传递的数据，并将其存储在项属性中，这就是为什么我们总是破坏项属性的原因。

<平面列表数据=｛data｝renderItem=｛(｛item｝(=>｛item.name｝｝/>