react

(1)componentDidMount() 钩子,这是一个建立定时器的好地方

(2)componentWillUnmount()生命周期钩子中卸载计时器

(3)关于setState:

setState()该函数将接收先前的状态作为第一个参数,将需要更新的值作为第二个参数

例如:this.setState((prevState, props) => ({ counter: prevState.counter + props.increment }));

(4)条件组件渲染:

function Greeting(props) {

  const isLoggedIn = props.isLoggedIn;

   if (isLoggedIn) {

   return <UserGreeting />;

   } return <GuestGreeting />;

}

(5)jsx嵌入:

function Mailbox(props) {

   const unreadMessages = props.unreadMessages;

  return (

  <div> <h1>Hello!</h1>

   {unreadMessages.length > 0 && <h2> You have {unreadMessages.length} unread messages. </h2> } </div> );

}

(6)阻止渲染:

可以return null

(7)状态提升,几个组件需要共用状态数据的情况,我们最好将这部分共享的状态提升至他们最近的父组件当中进行管理

通过在父组件定义函数<TemperatureInput onTemperatureChange={this.handleCelsiusChange} />,传到子组件,自组建在父组件传下的参数上传递参数handleChange(e) {this.props.onTemperatureChange(e.target.value);} 达到状态提升的效果

(8)组合&继承

<SplitPane left={ <Contacts /> } right={ <Chat /> } />

还有props.children的继承方式

 

posted @ 2017-08-14 11:08  wanpisces  阅读(100)  评论(0)    收藏  举报