class E extends Component{
constructor(props, context) {
super(props, context);
this.state = {
params: {
content: '',
title: '',
}
}
}
//点击展示状态机中的参数对象
clickHandle() {
console.log(this.state.params)
}
getTitle(e){
//思考为什么这里要将this.state赋值给state，单纯是想省掉写this的麻烦吗？
const state = this.state
state.params.title = e.target.value
this.setState(state)
}
//为什么不用这种方式？
getTitle(e){
this.setState({
params:{
title = e.target.value
}
})
}
render() {
return (
<div className="textBoxAll">
<input className="inputBox" value={this.state.title} onChange={this.getTitle.bind(this)} type="text" placeholder="请输入标题"/>
<button className="btn1" onClick={this.clickHandle.bind(this)}>发布</button>
</div>
);
}
}
如上面的代码，要在状态机中保存一个参数对象，以便于以后API传参数，但是这里就会遇到一个问题：当使用第二种方式的时候，状态机中的content就会被清除，这该如何解决呢？
为了防止这种情况的发生，就将this.state赋值给state常数，然后state对象去改变里面的值，最后通过setState()函数将状态机中的值全部被state对象替换。
2019.6.25更新补充：
感谢落雨
的提醒，上面的问题是由于我的疏忽造成的，如下：
//为什么不用这种方式？
getTitle(e){
this.setState({
params:{
//这里应该是冒号
title: e.target.value
}
})
}
留在文中，希望各位和我一样可以加深印象！
