0๐
I would emit event from ItemToolbar.vue
to Items.vue
, that then will decide which items it have to show: if title is present โ filtered, if not โ all items.
<template>
<div>
<ItemToolbar @filter="title = $event"></ItemToolbar>
<ItemList :all-items="filteredItems"></ItemList>
</div>
</template>
...
data() {
return {
title: '',
}
},
computed: {
...mapGetters(['allItems', 'searchByTitle']),
filteredItems() {
return this.title ? this.searchByTitle(title) : allItems
},
},
...
And emit that title
from ItemToolbar.vue
:
this.$emit('filter', VALUE_OF_THE_TITLE')
- [Vuejs]-Webix as Vue call method
- [Vuejs]-Using import/require in Vue.js data property with dynamic value
Source:stackexchange.com