React学习1.获取、遍历status值

import React, { Component } from 'react';


import '../assets/test.less'

class News extends Component {

    constructor(props) {
        super(props);
        this.state = {
            msg: "state属性的引入",
            list1: ['1', '2', '3'],
            list2: [<h2 key='1'>h2标签1</h2>, <h2 key='2'>h2标签2</h2>],
            list3: [
                { title: "aaaa" },
                { title: "bbbb" },
                { title: "cccc" }

            ],
        }
    }

    render() {
        // 处理数据
        var list1Result = this.state.list1.map(function (value, key) {
            return <li key={key}>{value}</li>
        })

        return <div className="news">
            {/* 引入样式news */}

            {this.state.msg}
            <br />
            {/* 本地图片引入 */}
            <img src={logo} />
            {/* 网络图片引入 */}
            <img src="http://pic41.nipic.com/20140508/18609517_112216473140_2.jpg" />
            <br />

            {/* 遍历数组 */}
            <h3>直接遍历</h3>
            {this.state.list2}
            <h3>render处理遍历</h3>

            <ul>{list1Result}</ul>
            <h3>return中处理遍历</h3>

            {
                this.state.list3.map(function (value, key) {
                    return <li key={key}>{value.title}</li>
                })
            }
            <br />
        </div>
    }
}
export default News;