Reactjs 使用异步/等待更新react本机状态

我正在尝试立即更新react native中的布尔状态变量。但是，wait关键字不起作用。因为状态设置器函数是异步的，所以如何使用async/await实现这一点？在vscode中，setLike setter函数前面的wait有一条消息：“wait对这种类型的表达式没有影响”

---

是否由于等待setLike（）而出现编译错误？ 如果不是，这是一个小问题，会让一些VScode用户感到困惑。

---

请检查如果我们谈论react钩子，您应该知道

useState（）

返回两个值的数组。第二个值是一个分派函数，用于更改状态值。这些函数是同步的。 在您的示例中，这个分派函数是

setLike（）

（它是同步函数）。因此，

await

关键字实际上对他们不起作用

React发动机罩中有特殊系统，可在不断变化的状态下工作。这个系统等待一批状态的改变，然后更新我们的状态并重新加载组件。在状态更新和组件重新加载之前，我们的

likeIt（）

函数将完成

您可以使用

useffect（）

lifecycle方法来处理

的更改，比如

状态

例如：

const likeIt=async（）=>{
log（'like pressed'）；
console.log（'liked？在设置之前'，like）；//**false**
等待setLike（like=>！like）；
}
useffect（（）=>{
console.log（'liked？在设置之后，'like）；//**true**
...
}，[like]）；

等待使用状态（）将不起作用

下面是一个可能的解决方案，它更适合于
likeIt（）函数中的temp变量

function App() {
  const [like, setLike] = useState(false);

   const likeIt = async () => {
     let temp = !like;

     const axiosAuth = await axiosWithAuth();
     const userToken = axiosAuth.defaults.headers.Authorization;

    if (!temp) {
      axiosAuth.delete(`https://url`)
              .then(res => console.log('res from unlike', res.data))
              .catch(err => console.log('err from unlike', err))
    } else {
      axiosAuth.post(`https://url`,{})
            .then(res => {
                console.log('response from post like: ', res.data);
            })
            .catch(err => console.log('error in post like', err.message))
    }

    setLike(temp);
}

  return (
    <div className="App">
      <button onClick={likeIt}>{like === true ? 'Liked' : 'Not Liked'}</button>
    </div>
  );
}

函数应用程序（）{
const[like，setLike]=useState（false）；
const likeIt=async（）=>{
让temp=！like；
const axiosAuth=等待axiosWithAuth（）；
const userToken=axiosAuth.defaults.headers.Authorization；
如果（！temp）{
axiosAuth.delete(`https://url`)
.then（res=>console.log（'res from inclusive'，res.data））
.catch（err=>console.log（'err from's'，err））
}否则{
axiosAuth.post(`https://url`,{})
。然后（res=>{
log（'来自类似post的响应：'，res.data）；
})
.catch（err=>console.log（'error in post-like'，err.message'））
}
setLike（温度）；
}
返回(
{like==true？'Liked'：'notliked'}
);
}
如果没有，那么您可以忽略它。非常感谢@chev。我需要为状态变量创建一个临时变量，以使函数的逻辑正常工作。谢谢
function App() {
  const [like, setLike] = useState(false);

   const likeIt = async () => {
     let temp = !like;

     const axiosAuth = await axiosWithAuth();
     const userToken = axiosAuth.defaults.headers.Authorization;

    if (!temp) {
      axiosAuth.delete(`https://url`)
              .then(res => console.log('res from unlike', res.data))
              .catch(err => console.log('err from unlike', err))
    } else {
      axiosAuth.post(`https://url`,{})
            .then(res => {
                console.log('response from post like: ', res.data);
            })
            .catch(err => console.log('error in post like', err.message))
    }

    setLike(temp);
}

  return (
    <div className="App">
      <button onClick={likeIt}>{like === true ? 'Liked' : 'Not Liked'}</button>
    </div>
  );
}