Web Demo Mobile Demo Angular Demo Vue Demo React Demo
源代码
<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>