类组件中state和setState()

state的基本使用：状态（state）即是数据,是组件内部的私有数据，只能在组件内部使用，且state的值是对象，表示一个组件中可以有多个数据

初始语法：

class KEL extends React.Component {
    constructor() {
        super () {
            // 初始化state
            this.state = {
                count: 0
            }
        }
        render () {
            return {
                <div>有状态组件</div>
            }
        }
    }
}

简化语法：

class KEL extends React.Component {
            // 初始化state
          state = {
                count: 0
            }
          render () {
            return {
                <div>有状态组件, {this.state.count}</div>
            }
      }
  }

获取状态：this.state

1	{this.state.count}

setState()修改状态：注：不要直接修改state中的值，【this.state.num=2】<-错误。【数据驱动视图】

语法：this.setState({key:val, key2:val2})

作用：修改state和更新UI

Eg：

// 正确
  this.setState({
      count: this.state.count + 1
  })
// 错误
this.state.count += 1

本文采用署名-非商业性使用-相同方式共享 4.0 国际许可协议，转载请注明出处。