ScrollView
import React from 'react';
import { ScrollView, Text } from 'react-native';
const ScrollExample = () => {
return (
<ScrollView>
<Text>内容1</Text>
<Text>内容2</Text>
{/* 添加更多内容 */}
</ScrollView>
);
};
export default ScrollExample;
FlatList
FlatList适用于长列表,它只渲染屏幕上可见的部分,因此性能更好。
import React from 'react';
import { FlatList, Text } from 'react-native';
const FlatListExample = () => {
const data = [
{ key: '1', content: '内容1' },
{ key: '2', content: '内容2' },
// 添加更多数据项
];
return (
<FlatList
data={data}
renderItem={({ item }) => <Text>{item.content}</Text>}
/>
);
};
export default FlatListExample;
在实际应用中,你可以根据需要定制ScrollView或FlatList,设置样式、添加加载更多的功能等。
转载请注明出处:http://www.zyzy.cn/article/detail/9470/React Native