# 搜索栏
# 平台差异
App | H5 | 微信小程序 | 支付宝小程序 | 头条小程序 |
---|---|---|---|---|
√ | √ | √ | √ | √ |
# Props
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
value / v-model | 绑定值 | string | ||
search-icon | 前缀图标 | string | cl-icon-search | |
show-search-button | 是否显示搜索按钮 | boolean | true | |
search-button-text | 搜索按钮文本 | stirng | 搜索 |
# Events
事件名称 | 说明 |
---|---|
search | 搜索按钮点击或者按下完成健 |
# Slots
插槽名称 | 说明 |
---|---|
prepend | 在元素的开始插入内容 |
append | 在元素的结尾插入内容 |
# 示例
基本用法
<cl-search v-model="val" placeholder="搜索图片、文章、链接" @search="onSearch"></cl-search>
插槽
<!-- prepend -->
<cl-search v-model="val1" placeholder="搜索图片、文章、链接">
<cl-avatar src="" slot="append"></cl-avatar>
</cl-search>