Javascript 真的不支持React钩子的异步设置状态吗？

我知道

React Hooks

不支持异步/等待等同步方法

只有当钩子的

setState

被同步并且值被成功存储时，我才必须处理下一个进程

对于原始的

this.setState（{..}）

，我使用回调来执行以下操作，但是我应该怎么做

钩住setState

比如,

export const FirstComponent = () => {
    const [peopleList, setPeopleList] = useState(null)
    const [myList, setMyList] = useState(null)

    const { data, loading, error } = useQuery(gql(GQL_GET_PEOPLE_LIST)

    useEffect(() => {
        const onCompleted = data => {
            setPeopleList(data.list)
       }

       if (!loading) {
          onCompleted(data)
       }
    }, [data, loading, error])

    ...

    const onChangeMyList = id => {
        setMyList(peopleList.filter(x => x.id === id)
          .map(x => x.item.originalList.lists) // <- This must be completed first!!
        openModal(true) // <- Then, it has to be executed!
    }

    ...

    return (
      <div>
        <p onClick={() => onChangeMyList(id)}>Click!</p>
      <div>
    )
}

export const FirstComponent=（）=>{
常量[peopleList，setPeopleList]=useState（null）
常量[myList，setMyList]=useState（null）
const{data，loading，error}=useQuery（gql（gql_GET_PEOPLE_LIST）
useffect（（）=>{
const onCompleted=数据=>{
setPeopleList（data.list）
}
如果（！加载）{
未完成（数据）
}
}，[数据、加载、错误]）
...
const onChangeMyList=id=>{
setMyList（peopleList.filter（x=>x.id==id）
.map（x=>x.item.originalList.lists）/解决此问题的一种方法如下：

const [modalOpen, setModalOpen] = useState(false)
useEffect(() => { if (modalOpen) openModal(true); }, [modalOpen]);

以后，您可以调用setModalOpen（true），而不是调用OpenModel（true）；
在这种情况下，您甚至不需要
useffect（）

由于您在更改列表时位于事件处理程序
onClick={（）=>onChangeMyList（id）}
中，因此React将自动批处理任何
setState（）
默认情况下调用更新。这意味着下一次渲染将在所有状态都已更新时进行。我不知道您是如何打开模式的，但您可以执行以下操作：

const [modalOpen, setModalOpen] = useState(false)
useEffect(() => { if (modalOpen) openModal(true); }, [modalOpen]);


函数应用程序（）{
const[myList，setMyList]=React.useState（['a'，'b'，'c']）；
const[openModal，setOpenModal]=React.useState（false）；
函数handleClick（）{
setMyList（['a'，'b'，'c'，'d'，'e'，'f']）；
SetOpenModel（真）；
}
返回(
myList:{myList}
单击以更改列表并打开模式
{openModal&&
我是模态。我与列表一起呈现：{myList}
}
);
}
ReactDOM.render（，document.getElementById（'root'）；

这是方便的时候了。