Vue js bootstrap запускает фильтрацию после нажатия кнопки

Как я могу активировать поисковый фильтр после нажатия кнопки? Я не хочу фильтровать каждый тип, который кто-то набирает в строке поиска. Я хочу запустить поиск, как только они нажмут кнопку «Искать сейчас».

<b-table
                        id="table-transition-example"
                        :busy.sync="loading"
                        :items="myProvider"
                        :fields="fields"
                        :current-page="currentPage"
                        :per-page="perPage"
                        striped
                        small
                        primary-key="user_id"
                        :filter="filter"
                        :sort-by="sortBy"
                        :sort-desc="sortDesc"
                        >

С помощью этого кода в любое время, когда кто-то набирает в строке поиска, автоматически выполняет поиск в таблице.

Можно ли как-нибудь добавить атрибут: filter, если я создам настраиваемое событие? ИЛИ любые другие идеи?


vuejs2 bootstrap-vue
person cos nik    schedule 20.07.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Свяжите другое свойство данных с вашим вводом и создайте метод, который присваивает значение из вашего ввода вашему свойству filter.

Пример:

<input v-model="filterInput">
<button @click="applyFilter">Search now</button>

<b-table :filter="filterTable"></b-table>

<script>
data() {
  return {
    filterInput: '',
    filterTable: ''
  }
},
methods: {
  applyFilter() {
    this.filterTable = this.filterInput
  }
}
</script>
person Hiws    schedule 20.07.2020