vue-- 利用过滤-实现搜索框的姓名的搜索


 
            <div class="fl w-200 m-l-30">
                <el-input placeholder="输入用户名" v-model="searchData">
                    <el-button slot="append"  icon="el-icon-search" @click="search()">搜索</el-button>
                </el-input>
            </div>

--------------------------------
    export default {
        data() {
            return {
                tableData: [],
                dataCount: null,
                currentPage: null,
                realname: '',
                multipleSelection: [],

                page_size:7,
                currentpagezyt:1,
                list:[],
                total:null, //和:total对应
                searchData: "",
            }
        },
    methods: {
      search() {
        this.page=1;
        this.getList();
      },
-------------------------
//处理数据
        getList() {
            //es6过滤得到满足搜索条件的展示数据list
            let list = this.tableData.filter((item, index) =>
                item.userName.includes(this.searchData)
            )//取每一个item,看看item的userName属性equal(input内的searchData)

            this.list = list.filter((item, index) =>
                index < this.page * this.limit && index >= this.limit * (this.page - 1)
            )
            this.total = list.length
        },

  

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM