react中循環節點的方式以及圖片引用的方式

import React from 'react'
import img from '../public/img/001.jpg' // 此時img是一個變量，在下面直接使用該變量即可引入該圖片
class New extends React.Component{
    constructor(props) {
        super(props)
        this.state = {
            msg: '直接定義的數據',
            list1: [<h1>1111</h1>,<h1>22222</h1>,<h1>3333</h1>],
            list2: [1,2,3,4,5]
        }
    }
    render() {
        let newList1 = this.state.list1.map(function (value, key) {
            return (<li key = {key}>{value}</li>)
        }); // 使用map方法將list1數組修改后渲染
        return <div>
            { this.state.msg }
            <img src={ img } title="引入圖片的兩種方式"/>
            <img src={require('../public/img/001.jpg')} alt=""/> // 通過require的方式可以獲取圖片
            <ul>
                {newList1}
            </ul>
            <ul>
                {
                    this.state.list1.map(function (value,key) {
                        return (<li key={key}>{value}</li>) // 使用map方法將list1數組修改后渲染

 }) } </ul> </div>  } } export default New