zoukankan      html  css  js  c++  java
  • 汽车系统实现--搜索功能

    <div id="app">
      <div class="panel panel-primary">
          <div class="panel-heading">
              <h3 class="panel-title">添加品牌</h3>
          </div>
          <div class="panel panel-body form-inline">
            <label>
                Id:<input type="text" class="form-control" v-model="id">
            </label>
    
            <label>
                    name:<input type="text" class="form-control" v-model="name">
            </label>
    
                  <input type="button" value="添加" class="btn btn-primary" @click="add"> 
    
                  <label>
                    搜索名称的关键字 :<input type="text" class="form-control" v-model="keywords">
                 </label>
          </div>
      </div>
    
    
    <table class="table table-striped">
        <thead>
          <tr>
              <th>Id</th>
              <th>Name</th>
              <th>Ctime</th>
              <th>Operation</th>
          </tr>
        </thead>
    
        <tbody>
        <tr v-for="item in search(keywords)" :key="item.id">
           <td>{{ item.id }}</td>
           <td>{{ item.name }}</td>
           <td>{{ item.ctime }}</td>
           <td><a href="#" @click.prevent="del(item.id)">删除</a></td>
        </tr>
        </tbody>
    </table>
    </div>
    

      

     search(keywords){ //根据关键字进行搜索
            // ----第一种方法哦
            // var newList=[];
            // this.list.forEach(item => {
            //     if(item.name.indexOf(keywords)!=-1){
            //         newList.push(item);
            //     }
            // });
            // console.log(newList);
            // return newList;
    
               // 第二种方式
               return this.list.filter(item=>{
                if(item.name.includes(keywords)){
                    return item;
                }
              })
    
            }
  • 相关阅读:
    Java安装以及环境变量配置
    IPython绘图和可视化---matplotlib
    Tensorboard可视化(关于TensorFlow不同版本引起的错误)
    Tensorboard可视化
    关于Tensorflow安装opencv和pygame
    perl将json转换成xml
    cnblogs终于把以前内容的管理权还给我了~
    final评论2
    final评论1
    psp
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/10872894.html
Copyright © 2011-2022 走看看