更新记录

1.0.0（2021-05-13）

新增搜索框组件

平台兼容性

Vue2 Vue3
√ ×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 app-vue × √ √ √ × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
√ × √ √ √ × √ √ √

sui-search

组件名：sui-search 代码块： sui-search

安装方式

本组件符合easycom规范，HBuilderX 2.5.5起，只需将本组件导入项目，在页面template中即可直接使用，无需在页面中import和注册components。

基本用法

在 template 中使用组件

<!-- 基本用法 -->
<sui-search @blur="blur"></sui-search>

<!-- 初始值 -->
<sui-search :focus="true" :value="searchValue" @blur="blur"></sui-search>

<!-- 自定义placeholder -->
<sui-search placeholder="自定义placeholder" @blur="blur"></sui-search>

<!-- 设置圆角 -->
<sui-search :radius="0" @blur="blur"></sui-search>

<!-- 禁止输入-->
<sui-search :disabled="true" @gosearch="gosearch"></sui-search>

API

suiSearch Props

属性名 类型 默认值 说明
value StringNumber 搜索栏绑定值
radius Number 10 搜索栏圆角，单位px
disabled Boolean false 是否禁止输入
placeholder String 搜索栏Placeholder
placeStyle String color:#999;font-size:24rpx; 搜索栏Placeholder样式
background String #F5F5F5 输入框背景
focus Boolean false

suiSearch Events

事件称名 说明 返回参数
@gosearch input 禁止输入时触发事件，返回参数为suiSearch的value e=value
@blur input 失去焦点时触发事件，返回参数为suiSearch的value e=value

右侧添加 的 slot 插槽

插槽称名 说明
right 右侧自定义插槽

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

无

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

许可协议

MIT协议
评论列表 撰写评论
加载更多...
插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...