Question

昨天我在第一篇文章中问，我有一个看起来像这样的json文件：

groups:{[
  {
    title:Animal
    shown:false
    data:[{....}]
  }
  ........
 .....
]}

我想在单击按钮时更改shown的值。我发现最接近问题的是这部分代码：

  newState = this.state.groups.map((val,i) => {
        if(index === i){
            return { ...val, shown: false};
        }
        return val;
    })
    this.setState({
        groups: newState,
    })

但是，这似乎不起作用，在按下按钮之前和之后，在控制台上登录都不会显示任何差异。我对此很陌生，所以您介意帮助我了解我做错了什么吗？

edit：我尝试将index更改为一个简单的数字，以查看是否是问题所在，但仍然是同样的问题。

Answer 1

JSON对象是键值对的集合。即

let FullName = {
  firstName: "Stack",
  lastName: "OverFlow"
}

在FullName对象中，键是firstName和lastName，对应的值是“ Stack”和“ Overflow”。

您定义的分组对象缺少关键属性。

出现问题：

案例1：如果组Object是对象数组，则：

var groups = [
    {
        title: 'Animal',
        shown: false,
        data: [{}]
    },
    {
        title: 'Birds',
        shown: false,
        data: [{}]
    }

]

/* Upadate By Index value */
/* 
  var index =  1;

  let updatedGroup = groups.map((val,i) => {
    if(index === i){
        return { ...val, shown: true};
    }
    return val;
  })
*/


/* Upadate By title */

/* let title = "Animal";

let updatedGroup = groups.map((val,i) => {
    if(val.title === title){
        return { ...val, shown: true};
    }
    return val;
}) */

// To toggle the shown Value Each Time

let title = "Animal";

let updatedGroup = groups.map((val,i) => {
    if(val.title === title){
        return { ...val, shown: !val.shown};
    }
    return val;
})
console.log("updatedGroup", updatedGroup);

案例2：如果组“对象”是“对象的对象”，则

var groups = {
    group1: {
        title: 'Animal',
        shown: false,
        data: [{}]
    },
    group2: {
        title: 'Birds',
        shown: false,
        data: [{}]
    }
}

let index = 1;
let updatedGroup = Object.values(groups).map((val, i)=>{
    if(index === i){
        return { ...val, shown: true};
    }
    return val;
}) 

console.log("updatedGroup",updatedGroup)

在单击按钮时更改特定项目的值

1 个答案: