Async Await 不适用于 React useStates 的状态

2024-06-24

我有一个 onClick 函数来删除一个项目。 当用户单击该按钮时,状态deletedItem将被分配该项目。 这是代码:

<button 
  type="button" class="btn btn-sm btn-black white-text"
  data-toggle="tooltip" data-placement="top" title="Remove item"
  onClick={ 
    async () => {
      await setDeletedItem(item.name);
      console.log(deletedItem);
      deleteCartItem()
    }
  }>x</button>

但单击按钮后状态不会立即更改。这是一值延迟,这使得我要删除的项目如此不准确。我还有其他异步/等待函数,并使用类在同一个 React 中设置状态,但它们工作得很好。这有什么问题或者如何解决这个问题吗?


为了async-await要正确工作,您需要将它们与返回 Promise 的函数一起使用。

由于来自react-hooks的状态更新器函数不返回承诺,因此它可能工作也可能不起作用。类组件中的 setState 函数也是如此

这里的解决方案是利用在状态更改时运行的 useEffect,您可以在此方法中调用响应状态更改所需调用的任何函数

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Async Await 不适用于 React useStates 的状态 的相关文章

随机推荐

  • Prolog:给定两个索引,创建子列表

    基本上 我需要创建 sublist S M N L 形式的谓词 其中 S 是由索引 M 和索引 N 之间 含 之间的 L 元素形成的新列表 这是我得到的 sublist sublist M N M gt N sublist S M N L
  • 使用 Java Spring 通过 SSH 执行命令

    我和一位同事正在开发一个 Web 应用程序来控制计算机集群 该计算机集群缺少 API 因此我们需要能够使用 Linux shell 通过 bash 脚本控制和添加 作业 每个用户都有特定的时间在集群上运行应用程序 因此我们需要能够使用用户凭
  • 使用手势或触摸事件旋转节点 Sceneform AR Core

    我在我的应用程序中使用 AR Core 作为 3D 查看器 我没有使用 Sceneform 进行 AR 渲染 而是使用 3D 渲染模型 我面临的问题是如何通过滑动手势或触摸事件来 360 度旋转模型 这对于 sceneform 来说是可能的
  • React Hook useEffect 缺少依赖项:xxx。包含它们或删除依赖项数组react-hooks/exhaustive-deps

    我正在进行 api 调用useEffect hook function ChangePassword props const token props match params token const state setState useSt
  • 使用 google gdata 客户端 API 从 Java/Scala 进行 OAuth2 授权

    您将如何执行与 执行 OAuth 2 0 小节中的 Google Net 示例 https developers google com google apps spreadsheets 使用等效的 Java api 我尝试使用 Java a
  • 以编程方式更改分辨率 OS X

    我的问题很简单 我正在开发一款游戏 正如标题所述 我希望能够以编程方式更改 OS X 上的显示分辨率 刷新率 我已经搜索了几个小时 但找不到任何东西 我已经知道如何创建全屏窗口 我还想获取支持的分辨率和刷新率的列表 来自苹果的适用于 Mac
  • 在 Jquery 数据表搜索框中添加提示文本的问题

    使用诸如 watermark js 之类的插件在 Jquery 数据表的搜索字段中添加灰色提示文本不是一个选项 我必须自定义编写它 我快到了 但面临着这个小而奇怪的问题 下面的代码片段解释了这一点 function toggleHintTe
  • 使用背景大小时忽略CSS背景位置[重复]

    这个问题在这里已经有答案了 我试图隐藏一个background image 即按比例缩放background size using background position 我故意不使用visibility或者任何会导致重新布局的东西在切换回
  • 字幕标签的缺点[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 如何在seaborn直方图上添加标准正态pdf

    我想在使用以下命令构建的直方图上添加标准正态 pdf 曲线seaborn import numpy as np import seaborn as sns x np random standard normal 1000 sns distp
  • C++20 概念:当模板参数符合多个概念时,会选择哪种模板专业化?

    Given include
  • 如何仅导出MySQL外键

    有谁知道如何导出 转储数据库的所有外键 我想修改字段 但外键有问题 所以我想删除所有外键并在更改完成后重新添加它们 问候 威廉 当心 先前建议的解决方案有一些局限性 它们不适用于多列外键 并且当您的列或表以某些有问题的单词命名时也会崩溃 例
  • 使用 selenium 和 bs4 进行网页抓取

    我正在尝试基于该页面的网络抓取构建一个数据框 https www schoolholidayseurope eu choose a country https www schoolholidayseurope eu choose a cou
  • 新的字符错误C(新的未声明)[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我不知道为什么新的会给我一个错误 这是代码 感谢您的帮助 include
  • 如何在html5画布上绘制圆柱体

    我想在画布上画一个圆柱体 并用控制箱来调整圆柱体的大小 这是我为回答我自己的问题而创建的一些 JavaScript 代码 function drawCylinder x y w h context beginPath to draw the
  • 如何使用dropzone上传base64图片资源?

    我正在尝试上传生成的客户端文档 目前的图像 Dropzone js http www dropzonejs com init js var myDropzone new Dropzone form dropzone autoProcessQ
  • 如何检测对象变量是否已更改?

    我有一个代表栅栏的类 其内部由矩形和圆形标记对象 也是我的类 组成 栅栏有 4 个变量 x1 x2 y1 和 y2 如果发生任何这些更改 我必须修改或重建内部标记对象 存储和检查 4 个值并不是什么大问题 但这只是我的世界对象类中的第一个
  • gtkmm-4.0 在 macOS Monterey 上运行时遇到问题

    我无法让 gtkmm 4 0 在 Mac OS Monterey 上运行 这是一个使用 gtkmm4 的简单 C 应用程序 helloworld cpp include
  • 手机关机后如何启动闹钟

    在我的应用程序中 我使用AlarmManager类设置闹钟 为了在手机重新启动后触发警报 我使用了BroadcastReceiver 一切正常 我的闹钟定期触发 现在在这种情况下出现了问题 假设我当前的时间是2 30 pm我把闹钟定在2 3
  • Async Await 不适用于 React useStates 的状态

    我有一个 onClick 函数来删除一个项目 当用户单击该按钮时 状态deletedItem将被分配该项目 这是代码