Searchbar

搜索栏。

搜索相关 - Searchbar - 图1

引入

  1. import mpSearchbar from 'mpvue-weui/src/searchbar';
  2. export default {
  3.   components: {
  4.     mpSearchbar,
  5.   },
  6. }

使用

  1. <mp-searchbar :isFocus=true :inputValue="inputValue" :placeholder="placeholder" @input="input" @blur="blur" @focus="focus" @confirm="confirm"></mp-searchbar>

API

参数说明类型默认值
value绑定的值，可使用 v-model 双向绑定String, Number-
isFocus获取焦点Booleanfalse
placeholder输入框为空时占位符String-
confirmType设置键盘右下角按钮的文字,可选值 send search next go doneStringright

confirmType 值对应的文字说明

  • send：右下角按钮为“发送”
  • search：右下角按钮为“搜索”
  • next：右下角按钮为“下一个”
  • go：右下角按钮为“前往”
  • done：右下角按钮为“完成”

Event

事件名说明参数
@on-input键盘输入时触发event
@focus输入框聚焦时触发event
@blur输入框失去焦点时触发event
@confirm点击完成按钮时触发event

WARNING

1.0.3 版本之前searchbar 输入框的值不支持数据双向绑定，输入时触发的事件为：input，详情见 issues 19。