react useState 异步 数据获取不到
useState中的 setXXXXX 属于异步函数，在useState第一次存储的时候，会有存储不上的时候
因为react中state的更新是异步的，我们setState后，react并不会立即将值做出改变，而是将其暂时放入pedding队列中。react会合并多个state，然后只render 一次，所以不要在循环里用useState，它有可能只render最后一次set的值
初始代码
console.log
方法一 : 利用
ref
官网中的一段话：如果你刻意地想要从某些异步回调中读取最新的 state，你可以用 一个 ref 来保存它，修改它，并从中读取
const App = () => { const [arr, setArr] = useState([0]); let ref = useRef(); useEffect(() => { ref.current = arr; console.log(arr); }); const handleClick = () => { Promise.resolve().then(() => { const now = [...ref.current, 1]; ref.current = now; setArr(now); }) .then(() => { setArr([...ref.current, 2]); }); } return ( <button onClick={handleClick}>change</button> ); } 复制代码方法二 ：使用（回调）方式传参
const handleClick = () => { Promise.resolve().then(() => { setArr(prevState => [...prevState, 1]); // 这里也可以不改，使用 setArr([...arr, 1]) }).then(() => { setArr(prevState => [...prevState, 2]); // 这里必须改成回调函数传参方式，否则会读取旧状态，导致异常 }); } 复制代码方法三 : 处理办法添加一个 副作用（
useEffect()）
异步获取数据存在的问题, 我这里通过useEffect用存储2次, 没办法 ，解决问题就行了，其他的也不重要
const [categtry, setCategtry] = useState([]); const [categData, setCategData] = useState([]); useEffect(() => { getCollaCategory(); }, []); useEffect(() => { // 这个useEffect很关键，第一次赋值但是获取不到，所以要再赋值一次 if (categtry) { setCategData(categtry); } }, [categtry]); const getCollaCategory = async () => { const { resp } = await call(service.getCollaCategory); if (resp.Code === 0) { // 第一次虽然在这里赋值了，但是外部想拿到 categtry这个变量还是空的 setCategtry(resp.CategoryTree.SubCategoryList); } } 复制代码
作者：Karsuo
链接：https://juejin.cn/post/7019482437373657101