基于Vuejs的搜索匹配功能

最新推荐文章于 2025-10-17 09:17:52 发布

原创

最新推荐文章于 2025-10-17 09:17:52 发布 · 1.2w 阅读

6 ·

CC 4.0 BY-SA版权

   最近一直在看vue，查了很多资料，看了很多文档和博客，大概半知半解了，然后利用所理解的知识写了一个简单的搜索匹配功能。 
  
大概长这个样子： 
  
   <!DOCTYPE html> 
 
   < 
  html> 
 
   < 
  head> 
 
   < 
  meta 
  charset=" 
  utf-8"> 
 
   < 
  title>Vue测试2</ 
  title> 
 
   < 
  script 
  type=" 
  text/javascript" 
  src=" 
  js/vue.min.js"></ 
  script> 
 
   < 
  style 
  type=" 
  text/css"> 
 
  *{ 
   
   padding: 
  0; 
 
   margin: 
  0; 
 
   font-size: 
  14px; 
 
   font-family: " 
  微软雅黑"; 
 
   } 
 
  #box{ 
   
   width: 
  500px; 
 
   height: auto; 
 
   border: 
  1px solid 
  #ccc; 
 
   margin: 
  50px auto; 
 
   padding: 
  10px; 
 
   } 
 
  . 
  search{ 
   
   width: 
  480px; 
 
   height: 
  100px; 
 
   text-align: center; 
 
   } 
 
  . 
  searchBox{ 
   
   width: 
  230px; 
 
   height: 
  40px; 
 
   outline: none; 
 
   text-indent: 
  10px; 
 
   margin-right: 
  20px; 
 
   } 
 
  . 
  btn{ 
   
   width: 
  100px; 
 
   height: 
  50px; 
 
   cursor: pointer; 
 
   font-size: 
  18px; 
 
   }