react条件渲染

在React 中，你可以创建不同的组件来封装各种你需要的行为。然后，依据应用的不同状态，只渲染对应状态下的部分内容。
React中的条件渲染和javascript中的一样，使用javascript运算符if或者条件运算符去创建元素来表现当前的状态，然后让React根据他们来更新UI。

使用if…else…语句

class App extends React.Component {
   
  state = {
   
    isLogin: true
  }
  logout = () => {
   
    this.setState({
   
      isLogin: false
    })
  }
  login = () => {
   
    this.setState({
   
      isLogin: true
    })
  }
  render() {
   
    const {
    isLogin } = this.state;
    const Button = () => {
   
      if(isLogin) {
   
        return <button onClick={
   this.logout}>退出<<