react的循环数组方法的使用

Posted 2021-02-05 zdping

react循环数组有2种方法

法一：直接在所需的地方循环（推荐）

<ul>
    {this.state.list2.map(function(value,key){
       return(<li key={key}>{value}</li>)
     })}
</ul>

法二：

import React from ‘react‘; 
class News extends React.Component{
    constructor(props){
        super(props)
        this.state={
            msg:‘新闻‘, 
            list:[‘1111‘,‘2222‘,‘3333‘]
        } 
    } 
    render(){ 
        let listResult=this.state.list.map(function(value,key){
            return (<li key={key}>{value}</li>)
        })        
        return(
            <div> 
                <ul>
                    {listResult}
                </ul> 
            </div>
        )
    }
}
export default News