好客租房77-setState方法说明(2推荐语法)

简介: 好客租房77-setState方法说明(2推荐语法)

1.2推荐语法

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

})

参数state:表示最新的state

参数props:表示最新的props

   //导入react

   import React from 'react'

   import ReactDOM from 'react-dom'

   

   //导入组件

   // 约定1:类组件必须以大写字母开头

   // 约定2:类组件应该继承react.component父类 从中可以使用父类的方法和属性

   // 约定3:组件必须提供render方法

   // 约定4:render方法必须有返回值

   

   class App extends React.Component {

       constructor(props) {

           super(props)

           console.log('生命周期钩子函数:construtor')        

       }

       state={

           count:1

       }

       //异步操作

       handleClick=()=>{

           // this.setState({

           //     count:this.state.count+1

           // })

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

               return {

                   count:state.count+1

               }

           })

           console.log(this.state.count)//1

         

       }

       //初始化state

       //1进行dom操作

       //2发送网络请求  

       render() {

           console.log('生命周期钩子函数:render')

           console.log(this.props,"props")

           return (

               <div id="title">

                   <h1>计数器:{this.state.count}</h1>

                 <button onClick={this.handleClick}>+1</button>              

               </div>

           )

       }

   }

   

   

   

   ReactDOM.render(<App></App>, document.getElementById('root'))

相关文章
|
前端开发 JavaScript
好客租房66-render-props模式-2使用模式
好客租房66-render-props模式-2使用模式
102 0
好客租房66-render-props模式-2使用模式
|
前端开发
好客租房37-多表单元素优化
好客租房37-多表单元素优化
128 0
好客租房37-多表单元素优化
|
前端开发
好客租房79-jsx语法的转换过程
好客租房79-jsx语法的转换过程
73 0
好客租房79-jsx语法的转换过程
好客租房16-jsx中的列表渲染
好客租房16-jsx中的列表渲染
97 0
好客租房16-jsx中的列表渲染
好客租房108-嵌套路由
好客租房108-嵌套路由
97 0
好客租房108-嵌套路由
|
前端开发
好客租房45-react组件基础综合案例-6边界问题
好客租房45-react组件基础综合案例-6边界问题
97 0
好客租房45-react组件基础综合案例-6边界问题
|
前端开发 JavaScript
好客租房76-setState方法说明(1更新数据)
好客租房76-setState方法说明(1更新数据)
82 0
好客租房65-render-props模式-1思路分析
好客租房65-render-props模式-1思路分析
91 0
好客租房73-4传递props
好客租房73-4传递props
82 0
|
前端开发 JavaScript
好客租房78-setState方法说明(3第二个参数)
好客租房78-setState方法说明(3第二个参数)
139 0