react 学习 - state -- 渲染值中包含html标签，列表

export default class App extends Component {

    constructor(){
        super()
        this.state = {
            article: '<div>使用dangerouslySetInnerHTML<i>如果包含html标签</i></div>',
            todos : [{
                id: 1,
                title: '吃饭',
                isCompleted: true
            },{
                id: 2,
                title: '睡觉',
                isCompleted: false
            }]
        }
    }

    render() {
        return (
            <Fragment>
                {/* 渲染值中含有html标签需要使用一下方式 */}
                <div dangerouslySetInnerHTML={{__html:this.state.article}}></div>

                {/* 渲染列表 */}
                {this.state.todos.map(todo =>{
                    return (
                        <div key={todo.id}>{todo.title}</div>
                    )
                })}
            </Fragment>
                
        )
    }
}