在React Native中,当你按下保存按钮后,数据不会自动重新加载是因为React Native的渲染机制是基于状态变化的。当你按下保存按钮后,需要手动更新数据并重新渲染列表。
以下是一种可能的解决方案:
下面是一个示例代码:
import React, { useState } from 'react';
import { View, Button, FlatList } from 'react-native';
const MyComponent = () => {
const [data, setData] = useState([]);
const handleSave = () => {
// 更新数据源
const newData = [...data, { id: data.length + 1, name: 'New Item' }];
setData(newData);
};
return (
<View>
<Button title="Save" onPress={handleSave} />
<FlatList
data={data}
renderItem={({ item }) => <Text>{item.name}</Text>}
keyExtractor={(item) => item.id.toString()}
/>
</View>
);
};
export default MyComponent;
在上述示例中,按下保存按钮后,handleSave函数会将新的数据项添加到data数组中,并通过setData函数更新数据源。由于数据源发生了变化,FlatList会重新渲染并显示新的数据项。
需要注意的是,这只是一种解决方案,具体的实现方式可能会根据你的项目结构和需求而有所不同。另外,如果你使用了其他的状态管理库(如Redux),你也可以根据该库的使用方式来更新数据和触发重新渲染。
领取专属 10元无门槛券
手把手带您无忧上云