Mint UI 搜索框-Search

2021-09-06 15:22 更新
搜索框,可顯示搜索結(jié)果列表。

引入

import { Search } from 'mint-ui';

Vue.component(Search.name, Search);

例子

基礎(chǔ)用法

<mt-search v-model="value"></mt-search>

設(shè)置顯示文字

<mt-search
  v-model="value"
  cancel-text="取消"
  placeholder="搜索">
</mt-search>

帶搜索結(jié)果

<mt-search v-model="value" :result.sync="result"></mt-search>

自定義搜索結(jié)果

<mt-search v-model="value">
  <mt-cell
    v-for="item in result"
    :title="item.title"
    :value="item.value">
  </mt-cell>
</mt-search>

API

參數(shù) 說明 類型 可選值 默認值
value 搜索結(jié)果綁定值 String
cancel-text 取消按鈕文字 String 取消
placeholder 搜索框占位內(nèi)容 String 搜索
result 搜索結(jié)果列表 Array
autofocus 自動聚焦 Boolean - false
show 始終顯示搜索列表 Boolean - false

Slot

name 描述
- 自定義搜索結(jié)果列表


實例演示

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號