輸入的時候徹底沒有問題,可是在修改涉及到使用其渲染的時候,就會把字符串渲染出來,而不是渲染原生的標籤對html
渲染時要使用 dangerouslySetInnerHTML屬性,而且傳入對象進行渲染函數
render函數return部分:this
<div ref="add" contenteditable="true" className={styles.areaBox}></div> <button onClick={(e) => { this.test(e) }}></button> <div contenteditable="true" dangerouslySetInnerHTML={{__html: `${this.state.add}`}} className={styles.areaBox}></div>
方法部分 :spa
test = () => { this.setState({ add: this.refs.add.innerHTML }) }
狀態部分 :code
constructor(props) { super(props);
this.state = { add: "" } }