READMME-CN.md

v-cascade

一个可爱的级联选择器(跨平台：PC，Mobile) Eng docs

介绍

例子

组件截图

地区选择

远程搜索

安装

// npm
$ npm install v-cascade --save

// or

// cdn
<script src="https://unpkg.com/v-cascade/lib/v-cascade.min.js"></script>

使用

<v-cascade
  v-model="locationModal"
  :data="location"
  :title="['省份','城市','区县']"
  addClass="cascade-location"
  @success="locationSuccess"
  @cancel="cancel"
></v-cascade>

// ES6
import vCascade from 'v-cascade'

Vue.use(vCascade)

Props

字段名	类型	默认值	描述
v-model	Boolean	false	控制组件显示和隐藏
data	Array	[]	组件的数据字段，必须使用固定的 json 格式，如{'key':key,'label','children':[]}, children 是一个可选择的 key 值
title	Array	[]	组件顶部显示的标题
addClass	String	''	为组件添加一个额外的 class
filterable	Boolean	false	是否开启组件本地搜索
remote	Boolean	false	是否开启组件的远程搜索，如果开启此项，那么需要额外添加一个 remoteMethod 方法来获取远程的数据
remoteMethod	Function	none	获取远程数据并且获取的数据也需要遵从 data 的格式规范(详情看 data 属性的描述，或看远程搜索的例子代码)
loading	Boolean	false	显示和隐藏 loading 图标
scrollable	Boolean	false	背景页面是否可以滚动
placeholder	String	Please enter...	指定没有搜索框的默认值
noFoundStr	String	Nothing found, click Button to use custom content	指定没有搜索返回结果为空时的文案
spLevel	Number	9999	指定最多选择的层级数

Events

Name	Description	return
success	成功选择后的回调函数	选择数据的json
cancel	关闭组件的回调函数	无
on-query-change	搜索字段变化后的回调函数	query值

Todo

• 过渡动画
• 多选
• 全局事件
• ...

贡献

Feel free to open an issue if you find a bug.

Feature requests and PRs are welcome.

LICENSE

MIT Licensed. See LICENSE.