vue3+ts el-tabel 搜索组件
爷爷页面
<template>
<searchstyle="z-index: 9999":options="options"placeholder="请选择时间,或输入名称、单选、多个勾选、模糊查询"@search="onSearch"></search>
</template>
<script lang="ts" setup>
const options = reactive([{label: '名称',field: 'name',type: 'input',},{label: '提交时间',field: 'time',type: 'times',},{label: '单选',field: 'select',type: 'select',items: [{ label: '杨幂', value: '1' },{ label: '杨颖', value: '2' },],},{label: '模糊搜索',field: 'vague',type: 'vague',remoteMethod(Text: any, selectOptions: any, callback: any) {user({ keyWord: Text, pageNum: 1, pageSize: 100 }).then((data: any) => {const list = data.records.map((item: any) => {return {label: item.name,value: item.value,extra: item.key,}})callback(list)})},},{label: '勾选搜索',field: 'check',type: 'check',remoteMethod(Text: any, selectOptions: any, callback: any) {user({ keyWord: Text, pageNum: 1, pageSize: 100 }).then((data: any) => {const list = data.records.map((item: any) => {return {label: item.name,value: item.value,extra: item.key,}})callback(list)})},},
])
const onSearch = (data: any) =>{做处理掉接口}</script >
引用组件