vue的模糊搜索

界之边缘的轮回 2019-12-11

<template>
<div>
  <div>
    <input type="text" @input="handleInput" v-model=‘mytext‘>
    <ul>
      <li v-for="(data,index) in dataList">{{data}}</li>
    </ul>
  </div>
</div>
</template>

<script>
export default {
  name: ‘App‘,
  data() {
    return {
      dataList:[‘dfef‘,‘geger‘,‘fefgw‘],
      mytext:‘‘
    }
  },

  methods: {
    handleInput(){
      console.log(this.mytext)
      this.dataList = this.dataList.filter(item=>item.indexOf(this.mytext)>-1);
    }
  },
}
</script>

<style scoped lang="stylus" ref="stylesheet/stylus">
 
</style>

相关推荐