在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ element ui 如何簡(jiǎn)潔地實(shí)現(xiàn)表格的搜索功能

element ui 如何簡(jiǎn)潔地實(shí)現(xiàn)表格的搜索功能

圖片描述

想輸入某一個(gè)人名或日期時(shí)能顯示想要的那一條信息(這個(gè)表格里的數(shù)據(jù)是用easy-mock模擬的)。
還有怎么過(guò)濾表格里全部的數(shù)據(jù)而不是只過(guò)濾當(dāng)前頁(yè)面的數(shù)據(jù)

回答
編輯回答
維他命

取決于你本來(lái)的表格數(shù)據(jù)是怎么拿的:

  1. 如果是一次性拿所有數(shù)據(jù),那就在前端進(jìn)行過(guò)濾,數(shù)組有filter方法,過(guò)濾完后重新把數(shù)據(jù)綁定到表格
  2. 如果拿的數(shù)據(jù)是動(dòng)態(tài)的,那就只能在點(diǎn)擊【搜索】按鈕時(shí)發(fā)送請(qǐng)求給后端,然后重新綁定到表格并顯示

本覺(jué)得這個(gè)問(wèn)題實(shí)在太簡(jiǎn)單,而且回答已經(jīng)很清楚了,看到又更新了一遍問(wèn)題,你這個(gè)估計(jì)是完全不懂前端...

你賦值給element ui的tableData
對(duì)tableData進(jìn)行修改,改完再重新賦值。
如:

//獲取的日期與名稱假設(shè)為: searchData
let resultData = tableData.filter(data=>{
    //日期假設(shè)date,人名 name
    if(data.date == searchData|| data.name.indexOf(searchData) != -1){ //此處根據(jù)具體需求判斷
        return true;
    }
});
//再把resultData 賦值給element ui組件就可以了。且這個(gè)不存在當(dāng)前頁(yè)面的問(wèn)題,一般過(guò)濾都是拿全部數(shù)據(jù)過(guò)濾
2017年3月5日 07:35