观看React文档做的一些笔记

组件(组件名称必须以大写字母开头。

)

函数组件

function Welcome(props){
  return <h1>hello, {props.name}</h1>
}

类定义组件

class Welcome extends React.Component{
  render(){
    return <h1>hello, {props.name}</h1>
  }
}

关于Setstate

1.不要直接更新状态(即不要直接用this.state.xxx=xxx来修改state状态)
2.状态更新可能是异步的
1.React 可以将多个setState() 调用合并成一个调用来提高性能。
因为 this.props 和 this.state 可能是异步更新的，你不应该依靠它们的值来计算下一个状态。

// Wrong
this.setState({
  counter: this.state.counter + this.props.increment,
})

正确写法是用setState() 来接受一个函数而不是一个对象。 该函数将接收先前的状态作为第一个参数，将需要更新的值作为第二个参数：

// Correct
this.setState(function(prevState, props) {
  return {
    counter: prevState.counter + props.increment
  };
});

3.状态更新合并
当你调用 setState() 时，React 将你提供的对象合并到当前状态。
4.数据自顶向下流动

事件处理

在 React 中另一个不同是你不能使用返回 false 的方式阻止默认行为。你必须明确的使用 preventDefault。

用keys提取组件

元素的key只有在它和它的兄弟节点对比时才有意义。
比方说，如果你提取出一个ListItem组件，你应该把key保存在数组中的这个<ListItem />元素上，而不是放在ListItem组件中的<li>元素上。