vue模糊查询并且高亮，并且搜索一句话中任意不相连的词都可以搜索到，举个完整的例子

好的，针对您的问题，可以使用Vue结合正则表达式来实现模糊查询并且高亮。同时，可以使用分词技术来实现搜索一句话中任意不相连的词都可以搜索到的功能。以下是一个完整的例子：

<template>
  <div>
    <input v-model="keyword" placeholder="请输入搜索关键字">
    <ul>
      <li v-for="(item, index) in filteredData" :key="index" v-html="highlight(item.text)"></li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      keyword: '',
      data: [
        { text: 'Vue.js 是一个构建数据驱动的 web 界面的渐进式框架。' },
        { text: 'Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。' },
        { text: 'Vue Router 是 Vue.js 官方的路由管理器。' },
        { text: 'Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。' }
      ]
    }
  },
  computed: {
    filteredData() {
      const pattern = new RegExp(this.keyword.split(/\s+/).join('|'), 'gi');
      return this.data.filter(item => pattern.test(item.text));
    }
  },
  methods: {
    highlight(text) {
      const pattern = new RegExp(this.keyword.split(/\s+/).join('|'), 'gi');
      return text.replace(pattern, '<span style="color: red">$&</span>');
    }
  }
}
</script>

在上述代码中，我们使用了computed属性来监听关键字的变化，并根据关键字筛选出符合条件的数据。同时，我们还使用了正则表达式和字符串的split方法来实现分词功能，使得搜索一句话中任意不相连的词都可以搜索到。最后，我们使用了v-html指令和highlight方法来将匹配到的关键字进行高亮显示。

希望这个例子可以帮到您！