会话存储在获取时会延迟吗?

Question

在我的react代码中，在组件内，我从会话存储中获取一个值(内部使用效果挂钩(。打印控制台时，它显示值。但是在渲染(或返回方法(内部，它没有刚刚获取的值。从会话存储中获取时是否有延迟？

在状态中存储相同并在渲染中获取后，绕了问题！

let myValue = '';
useEffect(()=>{
    myValue = sessionStorage.getItem("someKey");
},[]);
// In the return method
return {
    <div>{myValue}</div>
}

为什么在渲染中无法立即从会话存储中获取值？

Answer 1

这里的问题是，您期望变更可变值以触发重新渲染。React不起作用，如果您想更改值并重新渲染值，则需要另一种方法：

考虑：

const [myValue, setMyValue] = useState('');
useEffect(()=>{
   setMyValue(sessionStorage.getItem("someKey"));
},[]);
// In the return method
return {
    <div>{myValue}</div>
}

Answer 2

no，localstorage和Sessionstorage调用均为sync您不会在渲染中看到该值，因为该视图未重新渲染。您必须设置状态，获得新的道具或强迫渲染来查看它。

如何强制钩中的更新

const [, updateState] = React.useState();
const forceUpdate = useCallback(() => updateState({}), []);

Answer 3

它可以立即可用

return {
    <div>{sessionStorage.getItem("someKey")}</div>
}

Answer 4

no，所有SessionStorage调用均为synchronous。