搜索框。

  <div>
    <wv-search-bar 
      :autofocus="false" 
      v-model="value" 
      :result="filterResult"
      @search="onSearch"
      @cancel="onCancel"
    />
  </div>
</template>
<script>
export default {
  data () {
      value: '',
      defaultResult: [
        'Banana',
        'Orange',
        'Durian',
        'Lemon',
        'Peach',
        'Cherry',
        'Berry',
        'Core',
        'Fig',
        'Haw',
        'Melon',
        'Plum',
        'Pear',
        'Peanut',
        'Other'
      ]
  computed: {
    filterResult () {
      return this.defaultResult.filter(value => new RegExp(this.value, 'i').test(value))
    }
  },
  methods: {
    onSearch (val) {
      // 自定义搜索处理
    },
    onCancel () {
      // 自定义取消事件处理
    }
  }
}