React中循環渲染類似Vue中 的v-for

17==》循環數組 類似v-for

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(){
         return(
             <div>
                {/* 條年渲染  類v-for */}
                {this.state.goods.map(item=>
                  return  <li key={item.id}>{item.text}</li>
                )}
             </div>
         )
     }
}