javascript - 如何在React JS状态下渲染元素？

Question

我现在在渲染 html 标签的状态时遇到了麻烦。当我添加 'divangerlySetInnerHTML={{__html: this.state.actions}} 时，它似乎不能，因为我将在菜单的 li 标签中渲染

this.state = {
sideBar : '<li>[object Object]</li>'
}
// when i render
render(){
 return(
  { this.state.sideBar}
 ) ==> // '<li>[object Object]</li>'

//应该发生的是创建一个新列表

[对象对象]

Answer 1

您无需使用angerlySetInnerHTML即可使其正常工作。下面是使用

和
• 标签数组的示例，您可以直接在 React 中渲染它们。

  class App extends Component {
  
  constructor(props) {
      super(props);
  
      this.state = {
        list: ["list 1", "list 2", "list 3"]
      };
    }
  
    render() {
      return (
        <div>
          <ul>
              {this.state.list.map((obj, index) => <li key={index}>{obj}</li> )}
          </ul>
        </div>
      );
    }
  }