假设我们设置了一个上下文提供程序以及一些初始数据属性值。
在此过程中,假设消费者随后修改了这些属性。
页面重新加载时,这些更改将丢失。保存数据以便我们可以保留这些数据修改的最佳方法是什么?除了本地存储之外还有其他方法吗?
是的,如果您希望数据在重新加载后保持不变,您可以选择将该信息存储在服务器端(通过 api 调用)或浏览器存储(本地存储、会话存储、cookie)中。您要使用的选项取决于您希望实现的持久性级别。无论存储选择如何,它都可能看起来类似于
const MyContext = React.createContext(defaultValue);
class Parent extends React.Component {
setValue = (value) => {
this.setState({ value });
}
state = {
setValue: this.setValue,
value: localStorage.getItem("parentValueKey")
}
componentDidUpdate(prevProps, prevState) {
if (this.state.value !== prevState.value) {
// Whatever storage mechanism you end up deciding to use.
localStorage.setItem("parentValueKey", this.state.value)
}
}
render() {
return (
<MyContext.Provider value={this.state}>
{this.props.children}
</MyContext.Provider>
)
}
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)