//搜索功能
let searchValue = ref(""); //搜索框绑定值
let Search = () => {
if(searchValue.value.length==0){
showdata.value=data;
}
else{
showdata.value = data.filter((data)=>{
return data.username.search(searchValue.value)!=-1
})
}
};
//搜素取消事件
let cancal = ()=>{
showdata.value=data
}
// 表格列数据
var data = [
{ id: 1, username: "wyh", sex: "男", phone: "15660532032" },
{ id: 2, username: "你d", sex: "男", phone: "15660532032" },
{ id: 3, username: "你w", sex: "男", phone: "15660532032" },
{ id: 4, username: "你a", sex: "男", phone: "15660532032" },
];
//初始表格数据
const showdata = ref([])
初始
搜索
搜索框清除事件
搜索框内容变化事件
<el-input
class="userinput"
v-model="searchValue"
size="large"
suffix-icon="Search"
clearable
@clear="cancal"
@input="Search"
>输入框</el-input
>