如何在Vuejs中過濾多個元素

Question

我正在Vuejs實現一個應用程序，如果在父選擇中選擇了任何選項，我有兩個選擇正在過濾子選擇。 我想添加一個額外的過濾器來檢查它是否是客戶端：

我有一個包含所有數據的model.data，它基本上是一個元素數組：

model.data: [
    {id: 1, name: XYZ 1, is_client: 0, address: "ABCD Address 1"},
    {id: 2, name: XYZ 2, is_client: 1, address: "ABCD Address 2"},
    {id: 3, name: XYZ 3, is_client: 0, address: "ABCD Address 3"},
]

我有一個父v-model="company_name"的v-model="company_name" ，它在子選擇中用作過濾器

filteredCompanyOptions() {
    if (this.model.data)
    {
        return this.model.data
            .filter(f => f.name !== this.company_name.label)
            .map(d => ({label: d.name, value: d.id}))
    }
}

指導我如何實現這一目標。

Answer 1

如果回調函數返回的值為true，則元素將添加到已過濾的數組中，您可以根據需要使用許多布爾運算：

filteredCompanyOptions () {
  if (this.model.data) {
    return this.model.data
      .filter(f => f.name !== this.company_name.label && f.is_client === 1)
      .map(d => ({ label: d.name, value: d.id }))
  }
}

如果你的條件更復雜，你可以在回調體中做你需要的所有事情然后返回一個布爾值：

filteredCompanyOptions () {
  if (this.model.data) {
    return this.model.data
      .filter(f => {
        if (f.name !== this.company_name.label && f.is_client === 1) {
          return true
        } else {
          return false
        }
      })
      .map(d => ({ label: d.name, value: d.id }))
  }
}