react定时器动态修改state数组中对象的值

毕设港湾 2024年04月16日 10:03 毕业设计 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
                }
            ]
        }
    }

页面如此，想要在定时器中修改值以达到进度动态显示的效果

共2条回复我来回复

代码客栈

这个人很懒，什么都没有留下～

        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)

0条评论

源码客栈网

这个人很懒，什么都没有留下～

那你需要遍历一下数组，找到想要改变的项然后进行改变

let { TestData}=this.state;
  setInterval(()=>{
    TestData.map((item)=>{
      if(item.name=="Two"){ //如果想要 改变所有 就不用判断了 。 只想改变某一个 就需要 用唯一标识判断一下
        item.progress+=10;
      }
    })
    this.setState({
      TestData:TestData
    })
  })

0条评论

发表回复

登录后才能评论

react定时器动态修改state数组中对象的值

回复

发表回复

随便看看

热门回答