React循环渲染列表

在React中循环渲染列表,方式和Vue有点类似,Code as follows:

class MapLi extends React.Component {
    constructor(props) {
        super(props);
        this.state = {status: true};
    }
    render() {
        var ayy = ['毒液', '鲨鱼', '余烁'];
        var sta = true;
        return (
            <div>
                <ul>
                    {ayy.map((item, index) => {
                        return <li key={index}>{index} - {item}</li>
                    })}
                </ul>
                <div>{this.state.status ? <span>56666888</span> : ''}</div>
            </div>
        )
    }
}
ReactDOM.render(
    <MapLi />,
    document.getElementById('example')
)

猜你喜欢

转载自blog.csdn.net/weixin_42604536/article/details/87131643