[React learning] - three core attributes of components: state (seven)

[React learning] - three core attributes of components: state (seven)

2.2.2. Understanding

1. state is the most important attribute of the component object, and the value is an object (can contain multiple key-value combinations)
2. The component is called a "state machine", and the corresponding page display is updated by updating the state of the component (re-rendering the component)

2.2.3. Strong Attention

1. The this in the render method of the component is the component instance object
2. This is undefined in the component custom method, how to solve it?
   a) Mandatory binding of this: through bind() of the function object
   b) Arrow function
3. State data, which cannot be directly modified or updated
   

      <script type="text/babel">
      class Weather extends React.Component{
    
    

        constructor(props){
    
    
            super(props)
                this.state={
    
    isHot:false}
        }

        render() {
    
    
            return <h1>今天天气很{
    
    this.state.isHot?'炎热':'凉爽'}</h1>
        }
      }

    ReactDOM.render(<Weather/>,document.getElementById('test'))
    </script>