时间戳

首页 > 解决方案 > 反应两个 useStates，一个依赖于另一个

reactjs - 反应两个 useStates，一个依赖于另一个

问题描述

所以我有两个useStates，一个用于对象A，它将启动对象B。我的问题是我的渲染器选择了一个空的B数组，这会导致1/2秒的空白屏幕。（如果我尝试删除 obj A 上的初始化，我也会得到一个空白屏幕，因为两者都是必需的。）

如果有的话，我如何将第二个状态链接到第一个状态？

我可能做错了下面的事情。

const initializeObjA = () =>{
    return objectA //pick up data from realmdb
}

const [objectA, setObjectA] = useState(initializeObjA());
const [objectB, setObjectB] = useState([]);

useEffect(() => {
  if (!objectA) return
  setObjectB(objectA.property); // i actually have some other manipulation done on this property.
},[])


console.log("objectB ", objectB) // always [] for first render
return ...

标签： reactjsreact-native

解决方案

使用 2 个 useEffects。1 具有空依赖项（在挂载时运行一次），其他具有objectA作为依赖项。

在第一个 useEffect(empty dependency) 中，提供 null 作为初始值并在此处进行初始化。

在第二个 useEffect（具有依赖项）中，如果 objectA 未初始化，请确保返回）

const [objectA, setObjectA] = useState(null);
const [objectB, setObjectB] = useState([]);

const initializeObjA = () =>{
    // return objectA //pick up data from realmdb
    setObjectA(data)
}

useEffect(() => {
    initializeObjA()
},[]);

useEffect(() => {
  if (!objectA) return
  setObjectB(objectA.property); 
},[objectA])


推荐阅读