Reactjs 状态未更新

2024-03-27

  constructor(props) {

    super(props);
    this.state = {
      active: false,
      showSideBar: false,
      className: ""
    }
  }
  componentDidMount() {
    if (this.props.overlay) {
      this.setState({
        className: "wrapper_overlay"
      });
      alert(this.state.className);
    }
    else if (this.props.SideBarWithIcon) {
      this.setState({
        className: "wrapper_clopsed"
      });
    }
  }

我正在道具的帮助下更新我的状态,但组件正在获取道具,但状态没有更新


setState是异步的。只需在该方法的回调中发出警报即可。

if (this.props.overlay) {
  this.setState(
    { className: "wrapper_overlay" },
    () => alert(this.state.className);
  );
}

注意:您可以而且应该使用shouldComponentUpdate检查何时setState通话完成

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

Reactjs 状态未更新 的相关文章

  • 如何检查变量是否是生成器函数? (例如函数*产量)[重复]

    这个问题在这里已经有答案了 检查函数是否是生成器的可靠方法是什么 例如 let fn function yield 100 if fn instanceof for let value in fn 我能想到的唯一方法是fn toString
  • 每次用户在地址栏中按 Enter 时,Firefox 插件都会执行某些操作

    我正在尝试编写一个扩展程序 用于监视每次有人在使用地址栏时按下回车键时的情况 步骤将类似于 用户在地址栏中输入一堆文本并按 Enter 键 我的插件启动并接收用户输入的内容 然后我的插件决定如何处理用户输入的字符串 我通过使用在步骤 2 中
  • 更改模板标签 <# {% {{ 等后,John Resig 的微模板出现语法错误

    我在使用 John Resig 的 Micro 模板时遇到了一些麻烦 谁能帮我解释为什么它不起作用 这是模板 以及发动机的改装部分 str replace r t n g split join t replace gt t g 1 r re
  • 正则表达式没有按预期工作?

    我有这个正则表达式 new RegExp a z 0 9 ig 我正在测试一个不应该工作的字符串 vc 但它确实通过了测试 而且它不应该 new RegExp a z 0 9 ig test vc true 但如果我删除其中一个 or or
  • webpack 加载器并包含

    我是 webpack 的新手 我正在尝试了解加载器及其属性 例如测试 加载器 包含等 这是我在 google 中找到的 webpack config js 的示例片段 module loaders test js loader babel
  • VSCode 在 React 的 JSX 中错误地格式化三进制

    我正在运行 VSCode 来开发我的 React 应用程序 我有一个简单的三元 isLoading
  • 如何在 Angular 模板中嵌入 GitHub gist?

    角度忽略script其模板中包含标签 但加载 GitHub gist 需要它们 执行此操作的最佳做 法是什么 使用iframe 创造script动态标记 或者是其他东西 一种方法是创建一个iframe with script里面并在你希望你
  • Javascript:更改浏览器后退按钮的功能

    有没有办法让用户的浏览器上的后退按钮调用 JavaScript 函数而不是返回页面 您无法覆盖这样的行为 如果用户通过链接访问您的页面 则单击 后退 将使他们再次离开该页面 但是 您可以使页面上的 JavaScript 操作将条目添加到历史
  • ES6 生成器——它们真的是 async/await 的替代品吗?

    评论区的帖子之一this http blogs msdn com b typescript archive 2014 10 22 typescript and the road to 2 0 aspx打字稿博客文章说 如果我必须等到 2 0
  • 如何在Android上获取角度中的按键事件?

    我们如何在 Android 上的 Angular 中获取按键事件及其值 我使用phonegap Cordova Angular JS
  • Javascript 3d 绘图实用程序? [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 有谁知道有什么好的 javascript 3d 绘图实用程序吗 我知道每个网站都推荐过画布 3d 图
  • 如何禁用向左滚动?

    I got a div 元素 parent 包含多个子元素 item 我想启用滚动父元素一个方向 left OR正确的 否则什么都不会发生 看我的代码 parent scroll function gt gt gt scroll event
  • React i18next languageChanged 事件被多次调用

    我在我的 React js 应用程序中使用 i18next 进行翻译 我在 Header jsx 文件中添加了所有页面通用的语言下拉列表 我正在根据其中一个页面中的当前语言获取数据quiz jsx 因此 在语言更改时应该再次调用 api 问
  • 在 Jest 测试中设置时刻时区

    我有 util 函数 它以特定的日期格式解析给定的日期 即 2019 01 28 然后使用momentJS检索当天的开始并将其转换为 ISO 日期格式 dates js import moment from moment export co
  • 使用XMLHttpRequest自动网页刷新内存泄漏

    问候 我一直在为一些使用 8 位微控制器的硬件开发网络界面 该网页使用 HTML javascript JSON 和 XHR XMLHttpRequest 进行通信 我想做的是创建一个页面 使用 setInterval 使用控制器中的新值每
  • Kotlin JavaScript 到 TypeScript 定义文件

    我已经找到了ts2kt 库 https github com Kotlin ts2kt这将从任意位置创建 Kotlin 头文件 d ts文件 但是 我想朝相反的方向走 我想构建一个可以编译为 JavaScript 的 Kotlin 库 但我
  • ParseFromString 在 IE 中抛出错误,但在 Chrome 中不会抛出错误

    我正在使用传单的 KML 插件 该插件在 Google Chrome 中运行良好 然而 在 IE 中 它会在以下代码中引发错误 parser new DOMParser console log url outputs path to kml
  • “x modulo y”的结果是什么?

    引用 ECMAScript 规范第 5 2 节 符号 x modulo y y 必须是有限且非零 计算 值 k 与 y 具有相同的符号 或零 使得 abs k 因此 如果 y 为正 则 x modulo y 的结果 k 为正 无论 x 的符
  • 使用 JQueryUI Autocomplete 和 Meteor 的规范方法

    使用 Meteor 我想了解使用 JQuery UI 自动完成处理大量服务器端数据的最有效方法 我有两个工作提案 想听听关于差异的意见 以及是否有更好的方法来做同样的事情 使用发布 订阅 Server Meteor publish auto
  • 在哪里放置资源特定逻辑

    您能帮我考虑在 AngularJS 中将资源 服务 特定的业务逻辑放置在哪里吗 我觉得在我的资源上创建一些类似模型的抽象应该很棒 但我不确定如何做 API调用 gt GET customers 1 lt first name John la

随机推荐

  • 检查查询字符串是否为 int 的最佳方法?

    我的一位同事想到的一个问题是 检查查询字符串是否为 int 的最佳方法是什么 我建议使用经典的 Int Parse 和 try and catch 还建议使用 TryParse 其实我也想不出其他的办法了 有任何想法吗 Int32 TryP
  • 使用 jQuery 编写 OO Javascript

    我来自 Prototype JS 背景 通过使用 OO Javascript 被鼓励Class create 现在我正在做一些 JQuery 工作 并且尝试编写一些结构正确的 JQuery 代码 例如 我可以从两个不同的单击事件处理程序调用
  • MySQL SUM 函数

    我了解 SQL sum 函数 这是我的代码
  • 无法对文档执行 querySelectorAll。怎么修?

    我在做什么 我有从 PHP 数组生成的链接 该数组生成它自己的唯一 ID 该 ID 应该指向它自己的模态 弹出窗口 div 该 div 具有与链接 ID 匹配的 ID 模态框也是使用 PHP 数组自动生成的 我收到这个错误 我对此非常陌生
  • REPLACE INTO 查询是好的做法吗?

    我需要一个 SQL 查询来更新或创建数据库条目 如果某个客户尚不存在 我在网上找到了目前的解决方案 command CommandText REPLACE INTO Resource Tracer dbo Customer Customer
  • 如何登录 OpenEdge Progress?

    我找到了在 Progress 4GL 中记录某些内容的不同方法 但没有一个令人满意 简单的MESSAGE语句的缺点是它对帧的处理非常糟糕 ON CHOOSE OF btn Q4 DO MESSAGE Line 1 MESSAGE Line
  • struts2 中的 JQuery Grid - 初学者

    我对 struts2 和 JQuery 编程很陌生 在我的应用程序中 当调用 loginAction 时 如果用户是管理员 我会将他们定向到 AdminLoadAction 此操作加载 adminHome jsp 我需要的是 adminHo
  • 有没有办法将--compressed传递到PHP的curl_setopt()中?

    使用curl时 我发现我所访问的服务器上的行为有所不同 具体取决于我是否通过 compressed作为一个论点或不 我已经将 Accept Encoding 标头设置为 gzip deflate sdch curl setopt ch CU
  • 使用 NSPredicate 搜索 NSFetchedResultsController

    我已经被这个问题困扰了一段时间 并已尽力找出解决方案 我正在使用 Core Data 而且对于 iOS 编码来说相对较新 我在如何搜索 fetchedResultsController 以过滤掉用户在 searchBar 中输入的字符串时遇
  • kubernetes 中的 PreStop 钩子永远不会被执行

    我正在尝试创建一个小 Pod 示例 其中包含两个通过 emptyDir 卷共享数据的容器 在第一个容器中 我等待了几秒钟 然后它就被销毁了 在 postStart 中 我正在将一个名为 started 的文件写入共享卷 在 preStop
  • 即使有请求,为什么 gcc 也不抱怨数组边界?

    我正在使用 gcc 4 9 0 我希望看到编译器警告我超出数组范围 如果我编译这个 int main int table 5 0 table 8 1234 int x table 10 使用 g O2 Wall main cpp o mai
  • 如何使用 jQuery 将行追加到表中?

    您好 我尝试使用 jQuery 在表中添加一行 但它不起作用 可能是什么原因 而且 我可以为新添加的行添加一些值吗 这是代码
  • 地理数据网络服务

    我正在考虑编写一个程序来检查英国议会议员最近提出的一些里程声明 实际上大约有 45 000 个里程 我所掌握的数据相当准确 旅行的出发地和目的地通常仅 在城镇级别提供 我想做的基本上是查看他们提交的里程数据 查看从网络服务获得的 计算 里程
  • 当 Node.js 内部仍然依赖于线程时,它如何本质上更快?

    我刚刚观看了以下视频 Node js 简介 http www yuiblog com blog 2010 05 20 video dahl 并且仍然不明白如何获得速度优势 主要是 Ryan Dahl Node js 的创建者 曾经说过 No
  • Android Ion 缓存刷新

    我使用特定的网址在线获取图像 但网址本身每隔几分钟就会自动更改 我正在使用 ION 库Here https github com koush ion我遇到的问题是 当我刷新页面时 页面本身看起来正在刷新 但出现了完全相同的图片 我假设它是缓
  • 使用 Silverlight 的本地数据库

    对于 Silverlight 应用程序来说 什么是好的本地数据库 数据库的主要用途是提供本地数据缓存和同步服务 我不相信 SQL Anywhere 或 SQLite 会工作 因为它们使用非托管代码 无法在 silverlight 沙箱下运行
  • 如何对 Android 应用程序进行定时炸弹?

    大家好 有没有人有一个代码示例 说明如何对 Android 应用程序进行定时炸弹 使其在给定日期后无法运行 我想发布一个 测试版 应用程序进行测试 但希望确保它仅在该应用程序正式处于测试版时才能工作 我建议使用 Calendar 类并让您的
  • Android:从软键盘中删除 Enter 键

    在我的登录表单中 当用户单击 EditText 并按 Enter 键时 会插入一个新行 从而增加 EditText 的大小 下一刻 它返回到之前的位置 并在密码字段 这是下一个字段 中打印一个点 我想从软键盘上删除这个回车键 是否可以 Us
  • Android java.lang.ClassCastException:android.widget.LinearLayout 无法转换为 android.widget.TextView

    我试图打印在 listView 中单击的值 但随后出现以下异常 07 04 10 40 56 482 E AndroidRuntime 1356 FATAL EXCEPTION main 07 04 10 40 56 482 E Andro
  • Reactjs 状态未更新

    constructor props super props this state active false showSideBar false className componentDidMount if this props overla