账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    下面的代码,如何修改为多条件筛选?
    30
    0

    问题描述

    有一个筛选的表格,但是只能根据一个条件筛选,这里做了一个多选选择器,希望实现多条件筛选

    相关代码

    <template>
      <div class="table">
        <div class="search-Box">
             <el-select v-model="search" multiple placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
        <el-table  :data="tables" border style="width: 100%">
          <el-table-column  prop="date" label="日期"></el-table-column>
          <el-table-column prop="name" label="姓名"> </el-table-column>
          <el-table-column   prop="address"  label="地址"></el-table-column>
        </el-table>
      </div>
    </template>
    <script>
      export default{
        data(){
          return {
            search: [],  //搜索
            tableData: [
              { date: '2016-05-02',name: '王小虎', address: '上海市普陀区金沙江路 1518 弄' },
              {date: '2016-05-04',name: '王小虎',address: '上海市普陀区金沙江路 1517 弄'},
              {date: '2016-05-01',name: '李小虎',address: '上海市普陀区金沙江路 1519 弄'},
            ],  //表格内容
            options: [{
              value: '王小虎',
              label: '王小虎'
            }, {
              value: '章小虎',
              label: '章小虎'
            }, {
              value: '李小虎',
              label: '李小虎'
            },],
          }
        },
        computed:{
          tables:function(){
            var search=this.search;
            if(search){
              return  this.tableData.filter(function(dataNews){
                return Object.keys(dataNews).some(function(key){
                  return String(dataNews[key]).toLowerCase().indexOf(search) > -1
                })
              })
            }
            return this.tableData
          }
        }
      }
    </script>
    

    求大神指教,如何修改,跪谢!

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 包子(_n 普通会员 1楼
      502 Bad Gateway

      502 Bad Gateway


      nginx
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部