1.子父组件传值:
父组件向子组件传值:通过属性传递:name={},子组件通过props.name使用。
子组件向父组件值:通过调用父组件传过来的方法,
父:
<child onHandle={this.del.bind(this)}></child>这里如果不绑定this,this会指向子组件。
子组件:
<li onClick={this.props.onHandle.bind(this,index)}></li>
2.修改state数据时:
this.setState({name:'zxx'})优化为:
let a = this.props.state.name
this.setState((preState)=>{return {name: a}})
3.单向数据流:父组件向子组件传值,子组件不能修改父组件值。
4.react:是一个视图层框架,复杂点就得引用redux。函数式编程有利于自动化测试。
5.传值类型校验(对开发友好,不会阻止程序,会警告):propTypes(校验类型),defaultTypes(默认类型)
import PropTypes from 'prop-types'
TodoItem.propTypes = {
item: PropTypes.string,
}
TodoItem.defaultTypes = {
item: "hello"
}
如果是两种类型校验,符合其中一种:
TodoItem.propTypes = {
item: PropTypes.oneOfType([PropTypes.number,PropTypes.string]),
}
6.插入带有html标签的字符串
dangerouslySetInnerHTML={{__html:detail.detail}}