//导入react
import React from 'react'
import ReactDOM from 'react-dom'
import PropTypes from 'prop-types'
//导入组件
// 约定1:类组件必须以大写字母开头
// 约定2:类组件应该继承react.父类 从中可以使用父类的方法和属性
// 约定3:组件必须提供render方法
// 约定4:render方法必须有返回值
class App extends React.
constructor(props){
super(props)
console.log('生命周期钩子函数:construtor')
this.state={
count:0
}
}
//初始化state
//1进行dom操作
//2发送网络请求
DidMount(){
const title=document.getElementById("title")
console.log(title,"title")
console.log('生命周期钩子函数:DidMount')
}
handleClick=()=>{
this.setState({
count:this.state.count+1
})
}
render(){
console.log('生命周期钩子函数:render')
return (
<div id='title'>
<Counter count={this.state.count}></Counter>
<button id='btn' onClick={this.handleClick}>打豆豆</button>
</div>
)
}
}
class Counter extends React.{
render(){
console.log('子组件生命周期钩子函数:render')
return <h1>统计豆豆被打的次数:{this.props.count}</h1>
}
}
ReactDOM.render(<App></App>, document.getElementById('root'))
1setstate
2forceUpdate
3组件接受新的props