setState 是异步操作,在setState前后使用ref 始终都是慢一步,想要早setState同步后使用ref。请看下面:
<button onClick={ this.clickSubmit}>提交</button>
<ul ref={(ul) => { this.ul = ul }}>
{
this.state.list.map((item, index) => {
// dangerouslySetInnerHTML 不会展示标签
return (
<li key={index} dangerouslySetInnerHTML={{__html:item}}></li>
)
})
}
</ul>
// 添加数据
clickSubmit(e) {
// prevState 可以代替this.state
this.setState((prevState) => ({
list: [...prevState.list, 'demo']
}), () => {//此处是在setState异步执行成功后就会立即执行
console.log(this.ul.querySelectorAll('div').length,"ul");
})
}