kktselect

A Vue.js project

Build Setup

<template>
  <div>
    <kktselect
      :selected="selected"
      :_selected="selected2"
      :__selected="selected3"
      :options="source"
      @update="updateSelected"
      @_update="_updateSelected"
      @__update="__updateSelected"
      :allow-empty="false"
      :searchable="false"
      :show-labels="false"
      :show-last="true"
      placeholder="请选择"
      key="name"
      label="name">
    </kktselect>
  </div>
</template>

<script>
import Kktselect from '../src/Kktselect.vue'
export default {
  components: { Kktselect },
  data () {
    return {
      selected: null,
      selected2: null,
      selected3: null,
      source: [{
        name: "Rails",
        language: "Rails1",
        child: [{
          name: "Rails",
          language: "Rails1",
            child: [{
              name: 'a'
            },{
              name: 'aa'
            }]
        },{
          name: "Rails2",
          language: "Rails2",
          child: [{
            name: 'b'
          }]
        }]
      },{
        name: "Java",
        language: "Java2",
        child: [{
          name: "Rails",
          language: "Rails1",
          child: [{
            name: 'c'
          }]
        },{
          name: "Rails2",
          language: "Rails2",
          child: [{
            name: 'd'
          }]
        }]
      }]
    }
  },
  methods: {
    updateSelected (value) {
      // console.log(value)
      this.selected = value

    },
    _updateSelected (value) {
      // console.log(value)
      this.selected2 = value

    },
    __updateSelected (value) {
      // console.log(value)
      this.selected3 = value
    }
  }
}
</script>

<style>
body {
  font-family: Helvetica, sans-serif;
}
</style>