javascript - 在方法中过滤基于数组的对象的属性

标签 javascript vue.js vuejs3

我有以下两个简单的对象:

clinics: [
    { 
        id: 1,
        name: 'New Hampshire Veterinarian Clinic',
        plans: [
            'handle123',
            'handle567',
        ]
    },
    {
        id: 2,
        name: 'Westminster Moltchester Clinic',
        plans: [
            'handle123',
            'handle789',
        ]
    }
],
animals: [
    { 
        id: 1,
        handle: 'handle123',
        name: 'Cat',
    },
    {
        id: 2,
        handle: 'handle567',
        name: 'Dog',
    },
    {
            id: 3,
            handle: 'haneld789',
            name: 'Horse'
    }
],

我有以下方法:

updateAnimals(selectedOption, id) {
}

其中 selectedOptionclinics 数组中的一个对象。

我想过滤第二个数组,使其只包含所选选项中提到的句柄,但我在处理参数时遇到了问题。我想实现这样的目标:

updateAnimals(selectedOption, id) {
    let filteredAnimals = this.animals.filter(function({id, handle, name}) {
       // Access the selectedOption here so I can use it to filter
    });
}

但我不确定如何访问函数内的选定选项... 或者有更好的方法吗?

最佳答案

您可以像使用作用域中任何其他可用变量一样使用 selectedOption,只需直接使用它 selectedOption.something:

updateAnimals(selectedOption, id) {
    let filteredAnimals = this.animals.filter({ handle } => {
       return selectedOption.plans.includes(handle)
    });
}

关于javascript - 在方法中过滤基于数组的对象的属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66598309/

相关文章:

javascript - VueJS - 如何使用 ajax 调用的结果动态初始化模板

vue.js - 视觉 : Using material-design-icons offline/size

typescript - 如何使用 Typescript 处理 Vue 3 模板中的 DOM 对象

javascript - Vue V-绑定(bind)到以编程方式创建的实例

javascript - 如何在 mailto 正文中附加 Javascript 代码

javascript - 如何使用 jqplot 绘制自定义水平线?

javascript - ocLazyLoad 未加载 Controller ,如何修复?

javascript - Vue3 : Uncaught TypeError: 'set' on proxy: trap returned falsish for property 'NewTodo'

json - Vue3 : Using dynamically imported JSON in template

javascript - 在 JavaScript 中给出特殊结果的比较运算符