Vue过滤JSON

Question

如何过滤数据以显示名称？

我通过引用过滤卡

     <div v-for="item in stationCityData">
      <div v-for="option in filteredCity" style="background:#eee;padding: 20px">
<!-- <div v-for="option in item.children" style="background:#eee;padding: 20px"> -->
        <Card :bordered="false">
          <p slot="title">
            {{ option.title }}
          </p>
          <p>
            Content of no border type. Content of no border type. Content of no border type. Content of no border type.
          </p>
        </Card>
      </div>
    </div>

这是一个JSON

[
 {
  "title": "Mazowieckie",
  "children": [
   {
    "title": "Warszawa",
    "count": 10000

   },
   {
    "title": "Otwock",
    "count": 10600

   }
  ]
 }
]

我需要通过children.title进行过滤

我试过这样：

export default {
components: {
    Header,
    Footer,
    Col,
    Row
},
name: 'Index',
data () {
  return {
      stationCity: '',
      stationCityData,
      stationCitySearch: ''
  }
},
computed: {
  // Filtered by Cites
    filteredCity: function () {
        return this.stationCityData.filter((item) => {
            let childrens = stationCityData.map(function (q) {
                return q.children;
            });

            return item.childrens.match(this.stationCitySearch)
        })
    }
}

}

但没有成功 有没有办法做到这一点？过滤卡片由children.title。例如“华沙”

Answer 1

我知道这已经过时了，所以你可能已经解决了这个问题。这对我很有用：

<div v-for="item in filteredName"></div>

然后

{{1}}

当然，对我来说，我是从API调用JSON对象但我假设你在做同样的。