gpt4 book ai didi

javascript - 如何添加第二个按钮而不导致堆栈崩溃?

转载 作者:行者123 更新时间:2023-12-02 22:26:28 25 4
gpt4 key购买 nike

import React from 'react';
class App extends React.Component{
constructor(){
super()
this.state = {
count: 0
}
this.clicked = this.clicked.bind(this)
}
clicked(){
this.setState(prevState =>{
return {
count : prevState.count+1
}


})
}
doubled(){
this.setState(doubleState =>{
return {
count : doubleState.count+2
}


})
}
render(){
return(
<div>
<h1>
{this.state.count}
</h1>
<button onClick={this.clicked}>changed</button>
<button onClick={this.doubled}>changed and doubled</button>
</div>
)
}
}
export default App;

我的问题是:如何添加第二个按钮“加倍”而不崩溃?我是 react 新手,所以请不要责怪。第一个按钮可以正常工作,但是第二个按钮我遇到了一些问题。我应该写第二个类还是它可以在一个类中工作?

最佳答案

您没有绑定(bind) doubled() 函数。这意味着它会在按钮呈现后立即运行。这将依次更新状态,这将重新渲染并导致无限循环渲染,并且您将达到最大调用堆栈限制。

您需要添加 this.doubled= this.doubled.bind(this)

关于javascript - 如何添加第二个按钮而不导致堆栈崩溃?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59050058/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com