尝试过滤多个数组中的多个值 - Vue答案

【问题标题】：Trying to filter multiple values inside of multiple arrays - Vue尝试过滤多个数组中的多个值 - Vue
【发布时间】：2020-07-24 19:51:54
【问题描述】：

我的搜索功能出了什么问题？它适用于第一行（城市值），但不适用于其他行。如果我删除了 cityValues 行以外的所有内容，或者将 && 更改为 ||，则该函数可以工作，但不是这样。

我正在尝试搜索每个值的参数数组。含义：用户可以从多个下拉列表中选择多个选项，并查看结果。

对于某些上下文，cityValue、zipValue 等是数组。 cityValue 是一个字符串数组，其余都是数字数组。

谢谢

   computed: {
            filteredPropertyTypes() {
                return this.propertyTypes.filter(rental => {
                    return this.cityValue.indexOf(rental.city) !== -1 &&
                        this.zipValue.toString().indexOf(rental.zip.toString()) !== -1  &&
                        this.bedroomsValue.toString().indexOf(rental.bedrooms.toString()) !== -1 &&
                        this.bathroomsValue.toString().indexOf(rental.bathrooms.toString()) !== -1 &&
                        rental.rent.toString().includes(this.rentValue.toString());
                })
            }
        },

【问题讨论】：

标签： javascript vue.js filter

【解决方案1】：

根据 MDN，The indexOf() method returns the first index at which a given element can be found in the array, or -1 if it is not present.

arr.indexOf(searchElement[, fromIndex])

indexOf() 方法适用于数组并查看您的函数，您正在使用字符串作为数组。

有关 indexOf() 方法的更多信息，请查看here

编辑——根据附加信息，如果 cityValue、zipValue 等原本是数组，对它们使用 toString() 方法会使它们变成字符串

尝试将您的代码更改为

computed: {
  filteredPropertyTypes() {
    return this.propertyTypes.filter(rental => {
      return this.cityValue.indexOf(rental.city.toString()) !== -1 &&
        this.zipValue.indexOf(rental.zip) !== -1  &&
        this.bedroomsValue.indexOf(rental.bedrooms) !== -1 && this.bathroomsValue.indexOf(rental.bathrooms) !== -1 && rental.rent.includes(this.rentValue);
    })
 }
},

【讨论】：