在react中使用useState无法改变视图,数据改变但是视图未改变
未渲染的代码如下:
const [needLists,setNeedLists]=useState([])
const pressDownEnter=(e)=>{
if(e.keyCode===13){
needLists.push({
content:e.target.value,
status:0
})
setNeedLists(needLists)
e.target.value=""
}
}
未发生改变的原因可能是因为needLists本身并没有变化,因为needLists变量存储的地址是不变的
解决办法
通过数据结构让传入的新值和原来的数组指向的不是同一片内存,就能触发dom的更新
const [needLists,setNeedLists]=useState([])
const pressDownEnter=(e)=>{
if(e.keyCode===13){
needLists.push({
content:e.target.value,
status:0
})
setNeedLists([...needLists])
e.target.value=""
}
}