this.setState的使用

语法

简易写法：直接传入对象实现。 this.setState({

a:1，

b:2

})

注意：这种写法无法及时获取到最新的state值，也就是多个setState之间是相互异步的。不推荐这种方式例如： handleClick = () => {

this.setState({

a:this.state.a + 1

})

console.log(this.state.a); // 0 1

this.setState({

a:this.state.a + 1

})

console.log(this.state.a); // 0 1

}

推荐使用 this.setState(updater,callback)

参数：updater有两个参数，state和props，其中state一定是最新的 代码： this.setState((state,props) => ({

a:state.a + 1

}))

console.log(this.state.a); // 0 2

this.setState((state,props) => ({

a:state.a + 1

}))

console.log(this.state.a); // 0 2

完整代码

import React from 'react'

class Test1 extends React.Component{

state = {

a:0

}

handleClick = () => {

// this.setState({

// a:this.state.a + 1

// })

// console.log(this.state.a); // 0 1

// this.setState({

// a:this.state.a + 1

// })

// console.log(this.state.a); // 0 1

this.setState((state,props) => ({

a:state.a + 1

}))

console.log(this.state.a); // 0 2

this.setState((state,props) => ({

a:state.a + 1

}))

console.log(this.state.a); // 0 2

}

render(){

return (

)

}

}

export default Test1

文章链接

评论可见，请评论后查看内容，谢谢！！！评论后请刷新页面。