React中条件渲染

Posted 2020-11-26 iwishicould

17==》 条件渲染
 state初始化一般写在构造器当中

CharShop.js如下

import React, { Component } from "react";
export default class CharShop  extends Component {
    // state初始化一般写在构造器当中
    constructor(props){
        super(props);
        this.state={
            goods: [{ id: 1, text: "web111" }, { id: 2, text: "web222" },{ id: 3, text: "web333" }]
        }
    }

     render(){
        //  获取state中的内容
         let con = this.state.goods[0].text ? <h1>{this.state.goods[0].text}</h1>:null   //条件渲染 

         return(
             <div>
               {con}
             </div>
         )
     }

}