Reactjs React函数在第二次单击时更新状态？

我正在开发一个酒店功能，用户可以过滤并显示相应的可用房间，但是当我设置onClick更新过滤器并显示过滤后的房间时，房间在第二次单击后正确显示

const toggleSelection = (e) => {
    setFilters((prevFilters) => ({
      ...prevFilters,
      [e.name]: e.id,
    }));
    filterRooms();
  };

const filterRooms = () => {
   ....
   ....
    setRooms((prevRooms) => ({
      ...prevRooms,
      filtered: filtered_rooms,
    }));
  };

useState（）

（以及类组件的

this.setState（）

），因此第二个状态更新程序在运行时不会为

已筛选的\u房间

提供最新值

而不是：

const[some_state，setSomeState]=useState（…）；
const[some_other_state，setSomeOtherState]=useState（…）；
const someHandler=e=>{
设置某些状态（…）；
设置其他状态（（）=>{
//使用'some_state'计算'some_other_state'的值
});
};

您需要

在钩子中设置someotherstate

，并确保将

某些状态

标记为依赖项

const[some_state，setSomeState]=useState（…）；
const[some_other_state，setSomeOtherState]=useState（…）；
useffect（（）=>{
设置其他状态（（）=>{
//使用'some_state'计算'some_other_state'的值
});
}[某些州]；
const someHandler=e=>{
设置某些状态（…）；
};

很难对您的代码给出建议，因为它经过了相当的编辑，但可能是这样的：

const filterooms=（）=>{
// ...
设置房间（（先前房间）=>({
…我的房间，
过滤：过滤的房间，
}));
};
useffect（（）=>{
filterooms（）；
}，[filtered_rooms]）；
常数切换选择=（e）=>{
setFilters（（prevFilters）=>({
…前置过滤器，
[e.name]：e.id，
}));
};

---

请参阅一个简单（尽管有点做作）的示例。

您能用JSX编写更详细的代码吗