Package Exports

@yue0222/vue-tree-select
@yue0222/vue-tree-select/dist/tree-select.umd.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@yue0222/vue-tree-select) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Vue Tree Select

A tree select component for Vue 2.x based on Element UI.

Installation

npm install vue-tree-select

Usage

// main.js
import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import TreeSelect from 'vue-tree-select'

Vue.use(ElementUI)
Vue.use(TreeSelect)

<!-- YourComponent.vue -->
<template>
  <tree-select
    v-model="value"
    :options="options"
    :disabled="false"
    placeholder="请选择"
    @change="handleChange"
  />
</template>

<script>
export default {
  data() {
    return {
      value: null,
      options: [
        {
          key: 1,
          label: '一级 1',
          children: [
            {
              key: 4,
              label: '二级 1-1'
            }
          ]
        },
        {
          key: 2,
          label: '一级 2',
          children: [
            {
              key: 5,
              label: '二级 2-1'
            }
          ]
        }
      ]
    }
  },
  methods: {
    handleChange(data) {
      console.log('selected:', data)
    }
  }
}
</script>

Props

Property	Type	Default	Description
value	Number	null	选中的值
options	Array	[]	树形数据
disabled	Boolean	false	是否禁用
placeholder	String	'请选择'	占位文本

Events

Event Name	Parameters	Description
change	(data: Object)	选中值变化时触发

License

MIT