# Search 搜索框

# 介绍

用于搜索场景的输入框组件。

# 引入

在 main.js 中引入,参考快速上手

# 使用

background 可以自定义搜索框外部背景色。

<vs-search placeholder="请输入搜索关键词" />
1

# 事件

vs-search 提供了 search 和 cancel 事件。search 事件在用户点击键盘上的搜索按钮触发。cancel 事件在用户点击搜索框右侧取消按钮时触发。

<vs-search
  @search="onSearch"
  @cancel="onCancel"
/>
1
2
3
4

# 内容对齐

通过 input-align 属性可以设置输入内容的对齐方式,可以left居左,center居中,right居右。

<vs-search
  input-align="center"
/>
<vs-search
  input-align="right"
/>
1
2
3
4
5
6

# 内容对齐

输入框外附近的背景颜色可以修改。

<vs-search background="green"/>
1

# 禁用

通过 disabled 属性可以将组件设置为禁用状态。

<vs-search disabled></vs-search>
1

# 输入监听

绑定 input 事件即可监听输入框,注意需添加修饰符native

<vs-search @input.native="ipt"></vs-search>
1
Last Updated: 9/22/2022, 2:18:13 PM
Bathroom Mirror / You're Coming Right?
Justin Hurwitz