Javascript 将React状态对象转换为正确的JSON模式

我正在使用React开发一个漂亮的todo应用程序，刚开始使用一个工作示例，我正在设置示例数据状态，如下所示：

this.state = {
  Task: [{
      name: "Art",
      items: [{
          item: 'Work on glazing technique',
          isDone: false,
          dateCompleted: ""
        },
        {
          item: 'Prank call Dali and hang up',
          isDone: true,
          dateCompleted: "07/15/2018"
        },
        {
          item: 'Prepare new Masonite panels',
          isDone: true,
          dateCompleted: "07/15/2018"
        },
        {
          item: 'Purchase sable brush',
          isDone: true,
          dateCompleted: "07/15/2018"
        }
      ]
    },
    {
      name: "Music",
      items: [{
          item: 'Work on Symphony',
          isDone: false,
          dateCompleted: ""
        },
        {
          item: 'Finish Berklee class',
          isDone: true,
          dateCompleted: "07/12/2018"
        },
        {
          item: 'Practice guitar',
          isDone: true,
          dateCompleted: "07/10/2018"
        },
        {
          item: 'Build new studio',
          isDone: true,
          dateCompleted: "07/10/2108"
        }
      ]
    },
    {
      name: "Writing",
      items: [{
          item: 'Finish novel structure',
          isDone: false,
          dateCompleted: ""
        },
        {
          item: 'Work on middle part',
          isDone: true,
          dateCompleted: "07/08/2018"
        },
        {
          item: 'Puchase some index cards',
          isDone: true,
          dataCompleted: "07/08/2018"
        }
      ]
    }
  ],
  filter: [{
    keyword: '',
    Status: "SHOW_ALL"
  }],
  selectedProject: "0"
};

所以，现在我要设置axios并通过JSON读取数据，而不是显式设置。当然，下一步将设置express并将JSON读/写到数据库

但在将任务对象转换为JSON时，我做得并不好。这就是我到目前为止所做的：

{
  "name": "Art",
  "items": [{
      "item": "Work on glazing technique",
      "isDone": "false"
    },
    {
      "item": "Prank call Dali and hang up",
      "isDone": "true"
    },
    {
      "item": "Prepare new Masonite panels",
      "isDone": "true"
    },
    {
      "item": "Purchase sable brush",
      "isDone": "true"
    }
  ]
}, {
  "name": "Music",
  "items": [{
      "item": "Work on Symphony",
      "isDone": "false"
    },
    {
      "item": "Finish Berklee class",
      "isDone": "true"
    },
    {
      "item": "Practice guitar",
      "isDone": "true"
    },
    {
      "item": "Build new studio",
      "isDone": "true"
    }
  ]
}, {
  "name": "Writing",
  "items": [{
      "item": "Finish novel structure",
      "isDone": "false"
    },
    {
      "item": "Work on middle part",
      "isDone": "true"
    },
    {
      "item": "Puchase some index cards",
      "isDone": "true"
    },
    {
      "item": "Install Scrivener",
      "isDone": "true"
    }
  ]
}, {
  "filter": [{
    "keyword": "",
    "Status": "SHOW_ALL"
  }],
  "selectedCatelog": 0
}

在关闭

}的第一个实例中，{

在导入时抛出一个错误，说明：

syntax error, encountered comma

奇怪的是，JSON验证器说我的JSON是有效的。我没有正确构造JSON

基本上我认为我这里有一个集合。一个包含多个键值对的项的字典，第二个“项”是一个项数组

---

我确信正确地构造它是非常简单的，但是有人能给我一个提示吗？谢谢！

这些都是独立的对象，你根本不会把整个东西包装成一个json对象。它只是一堆用逗号分隔的对象

//you never wrap the json with an opener
    {//start
        "name": "Art",
        "items": [{
                "item": "Work on glazing technique",
                "isDone": "false"
            },
            {
                "item": "Prank call Dali and hang up",
                "isDone": "true"
            },
            {
                "item": "Prepare new Masonite panels",
                "isDone": "true"   
            },
            {
                "item": "Purchase sable brush",
                "isDone": "true"
            }]
    } //end of object
    ,//then a comma
    { //start of an object
        "name": "Music",
        "items": [{
                "item": "Work on Symphony",
                "isDone": "false"
            },
            {
                "item": "Finish Berklee class",
                "isDone": "true"
            },
            {
                "item": "Practice guitar",
                "isDone": "true"   
            },
            {
                "item": "Build new studio",
                "isDone": "true"
            }]
    }//end
    ,//then comma
 {//etc....
        "name": "Writing",
        "items": [{
                "item": "Finish novel structure",
                "isDone": "false"
            },
            {
                "item": "Work on middle part",
                "isDone": "true"
            },
            {
                "item": "Puchase some index cards",
                "isDone": "true"   
            },
            {
                "item": "Install Scrivener",
                "isDone": "true"
            }]
    },{
    "filter":[
            { 
                "keyword": "", 
                "Status": "SHOW_ALL" 
            }],
                "selectedCatelog": 0
     }
//close json here

---

您发布的json无效（您可以检查它），似乎您想要呈现一个对象列表

因此，您需要使用数组来包装整个内容：

[
  {
    "name": "Art",
    "items": [
      {
        "item": "Work on glazing technique",
        "isDone": "false"
      },
      {
        "item": "Prank call Dali and hang up",
        "isDone": "true"
      },
      {
        "item": "Prepare new Masonite panels",
        "isDone": "true"
      },
      {
        "item": "Purchase sable brush",
        "isDone": "true"
      }
    ]
  },
  {
    "name": "Music",
    "items": [
      {
        "item": "Work on Symphony",
        "isDone": "false"
      },
      {
        "item": "Finish Berklee class",
        "isDone": "true"
      },
      {
        "item": "Practice guitar",
        "isDone": "true"
      },
      {
        "item": "Build new studio",
        "isDone": "true"
      }
    ]
  },
  {
    "name": "Writing",
    "items": [
      {
        "item": "Finish novel structure",
        "isDone": "false"
      },
      {
        "item": "Work on middle part",
        "isDone": "true"
      },
      {
        "item": "Puchase some index cards",
        "isDone": "true"
      },
      {
        "item": "Install Scrivener",
        "isDone": "true"
      }
    ]
  },
  {
    "filter": [
      {
        "keyword": "",
        "Status": "SHOW_ALL"
      }
    ],
    "selectedCatelog": 0
  }
]

---

你不需要json对象以数组开头吗？我在redux中传递的大部分数据都是数组。你的对象看起来是一个对象，而Task似乎接受数组。实际上，你发布的json也无效。@Sagivb.g我知道，我告诉他他的错误在哪里，因为我写不出那么长的注释。好的，我只是想是的，JSON Linter背叛了我。它是无效的。我知道我做错了什么。这只是我实现的一堆不同的对象。