react知识补漏

默认属性值props

function Person(props){
    return 
}

Person.defaultProps = {
    name:'jim'
}

refs

<input ref="content">

this.refs.content

<input type="text" ref={input=>this.input=input} /> 可以这样设置获取得到input元素
使用的时候使用  alert("input-value"+this.input.value);

在严格模式下直接使用ref会报错

还有注意ref需要升级版本,不要提示会报错,但是能运行
https://stackoverflow.com/questions/53460689/react-ref-current-is-null

组件通信

父-》子 
props <child name={hahha} />

this.props.name

子-》父
1.在父组件定义修改方法
parent.js
  childChangeW(){
  	this.setState({
  		w:'childrenchange'+Math.random()
  	});
  }
2.当做props传递事件
<Statedchild name="hahhah" childChangeW ={this.childChangeW}/>

3.子组件用事件接收处理,不能直接触发的
<button onClick={this.changeFun}>改变父组件W</button>

	changeFun(){
		this.props.childChangeW();
	}

不能下面这样
X <button onClick={this.props.childChangeW}>改变父组件W</button>



样式

this.state = {bgc:'#53ff53}
	<p style={{background:this.state.bgc}}>{this.state.w}</p>
className={this.state.flag?'active':'haha'}
注意是两次括号的


生命周期



原文地址:https://www.cnblogs.com/cyany/p/12757957.html