c3lf/c3lf-system-3
9
0
Fork 0
Code Issues 55 Pull requests Projects 2 Releases Wiki Activity Actions

debounce search box

Browse source
This commit is contained in:
busti 2020-01-08 22:20:45 +01:00
parent 6bcbd59362
commit df43159acf
4 changed files with 18 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/components/Navbar.vue
View file

@ -31,7 +31,14 @@
</button>
<form class="form-inline mt-1 my-lg-auto my-xl-auto w-100 d-inline">
<input class="form-control w-100" type="search" placeholder="Search" aria-label="Search" @input="searchEventItems($event.target.value)">
<input
class="form-control w-100"
type="search"
placeholder="Search"
aria-label="Search"
v-debounce:500ms="myFunc"
@input="searchEventItems($event.target.value)"
>
</form>
<div class="collapse navbar-collapse" id="navbarSupportedContent">

4
src/main.js
View file

@ -14,6 +14,8 @@ import { library } from '@fortawesome/fontawesome-svg-core';
import { faPlus, faCheckCircle, faEdit, faTrash, faCat, faSyncAlt, faSort, faSortUp, faSortDown, faTh, faList, faWindowClose, faCamera, faStop, faPen, faCheck, faTimes, faSave } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import vueDebounce from 'vue-debounce';
library.add(faPlus, faCheckCircle, faEdit, faTrash, faCat, faSyncAlt, faSort, faSortUp, faSortDown, faTh, faList, faWindowClose, faCamera, faStop, faPen, faCheck, faTimes, faSave);
Vue.component('font-awesome-icon', FontAwesomeIcon);
@ -26,3 +28,5 @@ new Vue({
router,
render: h => h(App),
});
Vue.use(vueDebounce);