1、普通组件:静态组件 函数组件,里面的值不能动,除非你从新render
2、类组件:
class 类名 extends React.PureComponent/Component{
//继承了这两个类的实例
constructor(porps){
supper(porps);
this.state={
time:new Date().toLocaleString()
}
};
方法名(){
内容在prototype原型上
}
static 方法名{
内容在实例上;
}
static defaultProps={
//初始化状态属性值
title:new Date().toLocaleString()
}
static propTypes={
//属性的规则指定
title:PropTypes.string.isRequired//title不能不传的字符串内容
}
render(){
return{
<p>this.state.time}</p>
}
}
componentDidMount(){
//第一次加载组件渲染完毕
this.setState({
time:title:new Date().toLocaleString();
//这个方法做了两个事
//1、更改了time的值
//2、强制渲染了
}
}
3、属性的更改有两个方法:
* 1、设置默认值,让父组件再调用一次子组件,从新渲染就完了
* 2、把获取的属性赋值给组件状态,后期也可以修改
4、非受控组件:直接操作dom进行同步数据
* 1、render下的标签中加入ref
例如:<p ref={x=>this.timeBox=x;}>