react定时器动态修改state数组中对象的值
毕业设计
1
想问一下各位大腿子react如何在定时器中动态修改state中的数组中某个对象的值
代码如此: (想要修改的是其中的一个数组中的progress的值)
constructor(props){
super(props);
this.state = {
TestData:[
{
name:'one',
progress: 0,
ifshowOne: false,
ifshowTwo: false
},
{
name: 'Two',
progress: 0,
ifshowOne: false,
ifshowTwo: false
}
]
}
}
页面如此，想要在定时器中修改值以达到进度动态显示的效果
-
setTimeout(()=>{ let { TestData } = this.state TestData = TestData.map(item => { if(item.name=='one'){ return { ...item, progress:item.progress+1} } return item }) this.setState({ TestData }) },1000) -
那你需要 遍历 一下 数组，找到想要改变的项 然后进行 改变
let { TestData}=this.state; setInterval(()=>{ TestData.map((item)=>{ if(item.name=="Two"){ //如果想要 改变所有 就不用判断了 。 只想改变某一个 就需要 用唯一标识判断一下 item.progress+=10; } }) this.setState({ TestData:TestData }) })
发表回复