问题标签 [setstate]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - React 方法中的多个 setState() 调用:如何使其“同步”工作
所以我在我的 React 应用程序中遇到了一个问题,我遇到了一个特定的情况,我需要setState()
在一个方法中进行多次调用,然后在设置状态后让代码运行。下面的代码是一个用于在网站上添加帐户的对话框。
问题出在handleSubmit()
方法上,我需要检查用户是否在用户名和密码字段中输入了某些内容,并且密码和确认密码字段是否匹配。如果他们没有,我会在需要通过状态更改的字段中添加错误文本。然后我尝试查看状态以查看是否有任何错误。
不幸的是,正如我很快发现的那样,该setState()
函数是异步的,这意味着在我最终检查之前状态不会改变。我在谷歌上搜索并搜索了一种在执行代码之前等待状态改变的方法,但结果是空的。我现在已经解决了这个问题,并认为我会把它放在 Stack 上,这样其他人可能会从我提出的方法中受益。我还想知道我正在做的任何利弊,或者任何可能会更好的建议。
当我四处搜索时,我发现了一种发送回调的方法,setState()
如图所示:setState(data, callback)
. 起初我不认为这对我有用,因为我有多个setState()
电话。但是,我意识到我可以将该handleSubmit()
方法转换为使用三元组的单个setState()
调用。像这样:
匿名回调函数将在状态更改后执行,让我的检查工作。
我预见到这种方法的唯一问题是嵌套三元组,因为如果需要它们可能会变得非常混乱。这可能对我的程序有任何不利影响吗?或者我可以解决这个问题的更好方法?
我希望我的解决方案帮助了一些人。:D
javascript - 警告:setState(...):只能更新已安装或正在安装的组件
我无法摆脱这个错误。当我从数组中删除一项并更新状态时,就会发生这种情况。
经过一些调试,我发现如果我重新加载应用程序,直接进入此屏幕并删除,错误不会显示。但是,如果我导航到此屏幕,返回,然后再次转到此屏幕并删除,则会出现错误。如果我加载屏幕 10 次,我会得到(30)这样的错误。
我的猜测是,当弹出路由返回仪表板时,我没有关闭 firebase 连接。或者我使用的导航器没有正确卸载场景。或者 deleteRow() 函数有问题
我真的不知道我还能做什么......同样的问题遍布整个网络,但似乎不适用于我的场景。
javascript - React setState 渲染 3 次
伙计们,我正在使用 React 并且有一个问题:我正在从 json 中制作一组数据,当我在构造函数中执行 setState 时,它会渲染三遍。第一次和第二次我得到一个空数组,第三次我得到一个包含我需要的数据的数组。所以,问题是,如何仅从第三次渲染中获取该数据,或者如何优化我正在使用的方法?
这是我的构造函数(道具){
user-interface - 在 Autoit GUI 中显示或隐藏编辑控件
我想根据是否选中单选按钮来显示或隐藏编辑控件。以下Autoit代码在语义上显示正常但不起作用。有人可以帮忙吗?谢谢
authentication - 更新 React (Firebase) 中的状态未定义值
我正在使用 Firebase 创建一个登录页面。一旦用户登录,“auth”,firebase 就会返回一个“user”变量,我用它来让我知道是否将“loggedIn”的组件状态设置为 True 或 False。
auth 函数返回正确的“loggedin”和“loggedout”console.log 消息。但是,当它到达 setState 时,我不确定会发生什么。当我重新渲染时,我最初创建的登录状态(应该是 True 或 False)是“未定义”,这让我感到困惑。
javascript - 反应 setState 不更新状态
所以我有这个:
newDealersDeckTotal
只是一个数字数组,[1, 5, 9]
例如但是this.state.dealersOverallTotal
没有给出正确的总数,但是total
呢?我什至设置了超时延迟,看看这是否解决了问题。任何明显的还是我应该发布更多代码?
reactjs - React.Component setState 原子更新
https://facebook.github.io/react/docs/react-component.html#setstate
也可以传递带有签名 function(state, props) => newState 的函数。这会将原子更新排入队列,该更新会在设置任何值之前咨询 state 和 props 的先前值。例如,假设我们想通过 props.step 增加 state 中的值:
这里的原子更新是什么意思?JavaScript 不是单线程语言吗?这意味着所有更新都必然是原子的?
javascript - 在 React JS 的 this.setState 的回调中使用 this.setState?
是否可以在this.setState的回调中调用this.setState?
我正在制作一个 Roguelike Dungeon 并且有一个设置,在 this.setState 的回调中使用了一个辅助函数,它再次调用 this.setState。我的游戏在这一点上冻结了。
所以我在 React 组件中有一个对象,它有一个生成随机二维数组映射的方法:
当游戏开始时,我们在 componentDidMount() 中调用组件中的以下函数:
this.generateGamePlay() 看起来像这样,基本上随机生成并放置玩家、老板和物品在棋盘上:
但是当玩家死亡时,我们再次调用上面的方法来重置游戏:
但那是我的游戏冻结的时候。所以我第一次调用this.generateGamePlay()(调用this.setState)时它可以工作,但第二次它冻结了。任何人都可以帮助我吗?
reactjs - 如何添加新的键值来响应 js 状态数组?
我想将新的键值添加到数组 ınto 状态?我在下面告诉你我想做什么。我怎样才能做到这一点?1.consruture方法中的启动状态
在我用活动文件设置状态之后
this.setState({files: activeFiles})
筛选我的状态
{ files: [ { key1: val1, key2: val2, key3: val3 }, { key1: val1, key2: val2, key3: val3 }, { key1: val1, key2: val2, key3: val3 } ] }
如何为每个文件添加新的键值?我想要的状态
{ files: [ { key1: val1, key2: val2, key3: val3, key4: val4 }, { key1: val1, key2: val2, key3: val3, key4: val4 }, { key1: val1, key2: val2, key3: val3, key4: val4 } ] }