源代码
<template>
<div>
<h2>Lazy Filtering</h2>
<ComboBox placeholder="Searching..."
:data="data"
:lazy="true"
@filterChange="onFilterChange($event)"></ComboBox>
</div>
</template>
<script>
export default {
data() {
return {
data: [],
source: [
{ value: 11, text: "Mr. Nice" },
{ value: 12, text: "Narco" },
{ value: 13, text: "Bombasto" },
{ value: 14, text: "Celeritas" },
{ value: 15, text: "Magneta" },
{ value: 16, text: "RubberMan" },
{ value: 17, text: "Dynama" },
{ value: 18, text: "Dr IQ" },
{ value: 19, text: "Magma" },
{ value: 20, text: "Tornado" }
]
};
},
methods: {
onFilterChange(event) {
let q = event.filterValue || "";
this.data = this.source.filter(item => item.text.indexOf(q) != -1);
}
}
};
</script>