如何创建数组对象并将相同的对象值推入数组

Question

我有一个名为 categories 的数组，我将它作为按钮循环。我已经尝试了几个小时来找到一种像这样处理 JSON 的方法：

类别：[ { 名称：'计划'， 值：['Idea Generation'，'Naming'，'Revenue Models'，'Mockups & Wireframing'，'Presentation'，'Team Building'] }, { 名称：“设计”， 值：['Outsourcing','Logo','Graphics','Templates','UI/UX'] }, { 名称：'开发'， 值：['Hosting','Domain Names','Development','MVP','Payments','Product Demo','Templates'] }, { 名称：'市场'， 值：['SNS','Press','Blog','Market Research','Forms & Survey','Analytics','A/B Testing','Advertising'] }, { 名称：'管理'， 值：['招聘'，'项目管理'，'资金'，'法律'，'财务'，'反馈'，'协作与沟通'，'客户支持'，'生产力'，'投资者关系'] }, { 名称：'ETC'， 值：['文章'，'博客'，'学习'] } ]

查看此图片：https://imgur.com/VLo5cBW

我想要实现的与上面的 json 数据相同。 例如：当我点击 Plan 下的Idea Generation 按钮时，它将创建一个像这样的数组：

selected_category: [ { 名称：“计划”， 值：[“创意生成”] } ]

因此，如果我单击同一类别“计划”下的另一个按钮，例如Mockups & Wireframing，它将在对象上添加相同的name：

selected_category: [ { 名称：“计划”， 值：[“创意生成”，“模型和线框”] } ]

但是，如果我再次单击但在不同的类别 Design 上，例如它将是这样的：

selected_category: [ { 名称：“计划”， 值：[“创意生成”，“模型和线框”] }, { 名称：“设计”， 值：[“外包”] } ]

我不熟悉构造数组对象数据，所以在这里需要帮助。

Answer 1

你想要做的是使用 vue 的 v-on 属性 (@click) 来调用一个具有你的逻辑的方法，它将它添加到看起来像这样的数组中

<button @click(addToSelectedItems(data.name, data.value)>Click me </button>

addToSelectedItems(name, value){
    var index = selected_category.findIndex(c => c.name == name);
    if (index === -1) {
        selected_category.push({
            name: name,
            value: value,
        });
    }
    selected_category[index].value.push(value);

}

语法可能不正确，但这是粗略的想法