<a href="https://admin.makeit.vip/"><img width="200" src="https://file.makeit.vip/MIITVIP/M00/00/00/K4vDRGPcbmmAG8_sAAAtlj6Tt_s562.png"></a><a href="https://admin.makeit.vip/components/search" target="_blank" style="color: #41b995">Makeit Search</a>
基于 Vue3.x + Vite2.x 开发的搜索组件
![npm_downloads]()
关于
Makeit Search 搜索组件，基于 Vue3.x + Vite4.x 开发，默认根据本地数据进行数据筛选，支持远程搜索，同时也支持搜索结果分页配置，自定义结果列表中每一项的点击事件等。:whitecheckmark: 默认根据本地数据进行过滤筛选 :whitecheckmark: 支持配置远程接口获取待筛选数据 :whitecheckmark: 支持远程搜索延迟 :whitecheckmark: 支持自定义搜索框的外观（宽高、主题色、文本颜色等 ···） :whitecheckmark: 支持列表与结果的分页显示 :whitecheckmark: 支持14种搜索框显示与隐藏的动画效果配置 :whitecheckmark: 支持自定义点击选项的回调事件 :whitecheckmark: 支持自定义搜索列表模板
安装
```bash npm i makeit-search ```使用
```ts import { createApp } from 'vue' import MakeitSearch from 'makeit-search' import 'makeit-search/dist/search.min.css' import App from './app.vue' const app = createApp(App) app.use(MakeitSearch) app.mount('#app') ```示例
```vue<!-- 基础效果 --><mi-search :data="searchData" search-key="title" /><!-- 自定义模板 --><mi-search :data="searchData"search-key="title"border-color="#2F9688"search-key-color="#2F9688":radius="42":pagination="true":page-size="3"><template v-slot:itemTemplate><div class="avatar"><mi-search-key type="image" tag="img" name="avatar" /></div><div class="info"><div class="title"><mi-search-key name="title" /></div><div class="content"><mi-search-key name="content" /></div></div></template></mi-search><!-- 支持远程搜索 / 搜索延迟 --><mi-search search-key="title"border-color="#3399ff"search-key-color="#3399ff"search-action="v1/captcha/init":search-delay=".3" />更多
更多定制化内容及使用请查看在线示例：https://admin.makeit.vip/components/search
