reactjs - React Native 保存旧的文本输入数据
问题描述
所以我有一个文本输入,每次更改都会保存到 setState 中。但是,如果我点击取消按钮返回一页,然后我回到第一页,我的更改仍然在第一页上。
我觉得这可能是在我的页面上保存缓存或其他内容的手机,但我怎样才能重置这个值?
我也在为我的页面导航使用反应导航
<TextInput
ref={ref => this.companyNameInput = ref}
onChangeText={text => { setCompanyNameInput(text); setSaveFlag(true);}}
style={{
position: 'absolute',
left: 150,
color: 'rgba(0, 159, 150, 1)'
}}
>
<Text12
style={{
color: 'rgba(0, 159, 150, 1)',
padding: 0,
marginBottom: 0
}}
>
{companyNameInput}
</Text12>
</TextInput>
解决方案
当您按下取消按钮时,您可以重置您的文本输入
let companyNameInput = null; //if this is functional component else class then use this
const onCancel = () => {
companyNameInput.clear()
}
或者您可以像这样在当前屏幕的模糊上设置事件侦听器
useEffect(() => {
const unsubscribe = props.navigation.addListener('blur', () => {
onCancel();
})
}. [props.navigation])
你也可以通过这个清除你的状态变量
setCompanyNameInput('');
注意:如果您使用的是类组件,则使用 componentWillUnmount 而不是 useEffect,“this”仅适用于基于类的组件
推荐阅读
- in-app-billing - 为什么谷歌在我得到的美元上花了 0.3
- javascript - 使用 React、Redux 和 Redux Form 编辑数据后出错(生成新的空列表)
- kotlin - 如何同时运行期货清单?
- python - 使用 Difflib 在 Python 中比较两个不同的 JSON,只显示差异
- fonts - FontForge - 生成 TTF 字体时删除抗锯齿/子像素渲染
- azure-ad-b2c - Azure AD B2C 自定义策略,如何将应用程序范围放入访问令牌
- docker - 我可以在 docker 容器中放置什么?
- machine-learning - 除了训练、验证和测试数据集之外,如何评估全新数据集上的机器学习模型性能?
- reactjs - 如何使用 Gatbsy Image 映射我在 GraphQL 中的默认导出?
- python - 旋转数组 - 通过使用另一个数组