arrays - VueJS - 从复选框选择中过滤项目

Question

我希望通过类别名称来优化我的数据输出。

如何通过cat_array过滤输出项？同时保留我的文本搜索过滤器？

    {
    "id": 1,
    "title": "Title one",
    "category_data": {
        "2": "Team",
        "7": "Queries"
    }
},

我用这个测试过：

return  vm.info.filter(item => this.cat_array.includes(item.category_id))

Codepen 示例：https ://codepen.io/anon/pen/XxNORW?editors=1011

谢谢

标签： arrayscheckboxvue.jsvuejs2

Answer 1

一种方法-（没有考虑All逻辑）：

this.info.filter(
  item => Object.values(item.category_data).some(
    cat => this.cat_array.includes(cat))
)

演示：

var info = [
    {
        "id": 1,
        "title": "Title one",
        "category_data": {
            "2": "Team",
            "7": "Queries"
        }
    },
    {
        "id": 2,
        "title": "Title two",
        "category_data": {
            "2": "Team",
            "7": "Queries"
        }
    },
    {
        "id": 3,
        "title": "Title three",
        "category_data": {
            "2": "Team",
            "7": "Queries"
        }
    },
    {
        "id": 4,
        "title": "Title four",
        "category_data": {
            "2": "Team",
            "7": "Queries"
        }
    },
    {
        "id": 5,
        "title": "Title five",
        "category_data": {
            "2": "Team",
            "6": "Questions",
            "7": "Queries"
        }
    },
    {
        "id": 6,
        "title": "Title six",
        "category_data": {
            "2": "Team",
            "6": "Questions",
            "7": "Queries",
            "12": "Fax",
        }
    }
]

var cat_array = ["Questions"]

console.log(
  info.filter(
    item => Object.values(item.category_data).some(
      cat => cat_array.includes(cat)
    )
  )
)