猿问

如何在一个 onClick(ReactJS) 中调用一个类和 setState

我对 React 还很陌生,我想知道如何在一个类中调用一个函数(比如 this.handleChange)和一个带有 setState 的箭头函数,在一个按钮的一个 onClick 中。

我试过在两行代码之间使用逗号和 && 。

<button name="Plus" onClick={() => this.setState({ Operator: 'plus' }) && this.handlePlus}>+</button>

上面的代码在render和return里面。

预期的结果是代码调用函数并改变状态。相反,它只是改变状态(所以只有第一部分)。

请帮忙,先谢谢了!


慕斯709654
浏览 211回答 3
3回答

猛跑小猪

setState()有一个可选的第二个参数,它是一个函数,一旦设置了状态就会被调用。你可以这样做:this.setState({ Operator: 'plus' }, this.handlePlus);您还可以使用componentDidUpdate生命周期:componentDidUpdate(prevProps, prevState) {&nbsp; if(this.state.Operator === 'plus' && prevState.Operator !== 'plus') {&nbsp; &nbsp; this.handlePlus();&nbsp; }}

墨色风雨

只需this.setState({ Operator: 'plus' }在handlePlus函数内添加。

浮云间

< button name = "Plus"onClick = {&nbsp; () => this.setState({&nbsp; &nbsp; Operator: 'plus'&nbsp; }, () => this.handlePlus())} > + < /button>this would work fine.orif you are lookingfor something like this....you can handle multiple buttonClick event like this&nbsp; <&nbsp; button name = "Plus"value = "yourValue"onClick = {&nbsp; this.handleChange} > + < /button>handleChange = (e) => {&nbsp; const {&nbsp; &nbsp; name,&nbsp; &nbsp; value&nbsp; } = e.target;&nbsp; switch (name) {&nbsp; &nbsp; case 'Plus':&nbsp; &nbsp; &nbsp; this.setState({&nbsp; &nbsp; &nbsp; &nbsp; [name]: value&nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; break;&nbsp; &nbsp; default:&nbsp; &nbsp; &nbsp; //enter code here&nbsp; &nbsp; &nbsp; break;&nbsp; }}
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答