VUE: With retrieving a variable from the array by filtering by value

Question

VUE: With retrieving a variable from the array by filtering by value

Navigation

#1 by (3 votes)

0

Good afternoon, I need to retrieve the name variable from this array of objects, when I filter by id , when I type for example id 1, return "Solid"

full_category_list: [
    {
        id: 1, 
        name: 'Sólido',
        parent : 0,
    },
    {
        id: 2, 
        name: 'Líquido',
        parent : 0
    }
]

javascript vue.js

asked by anonymous 25.10.2018 / 22:23

1 answer

Error sending form with if: else condition in laravel Hierarchy of requests with Await [closed]

score 3 · Accepted Answer

You can create a computed property which will calculate which category is selected.

new Vue({
    el: '#app',
    data: {
        selected: null,
        full_category_list: [
            {
                id: 1, 
                name: 'Sólido',
                parent : 0
            },
            {
                id: 2, 
                name: 'Líquido',
                parent : 0
            }
        ]
    },
    computed: {
        selected_category: function() {
            var category = this.full_category_list.find(cat => cat.id == this.selected);
            return category ? category.name : "Nenhum selecionado";
        }
    }
});

<script src="https://cdn.jsdelivr.net/npm/vue"></script><divid="app">
  <input v-model="selected">
  <div>{{ selected_category }}</div>
</div>