本文例項為大家分享了vue實現下拉選單樹的具體程式碼，供大家參考，具體內容如下

效果：使用 Vue-Treeselect 實現

建議通過npm安裝vue-treeselect，並使用webpack之類的捆綁器來構建您的應用程式。

npm install --save @riophae/vue-treeselect

官網例項 配置屬性請檢視官網

<!-- Vue SFC -->
<template>
 <div id="app">
 <treeselect v-model="value" :multiple="true" :options="options" />
 </div>
</template>

<script>
 // import the component
 import Treeselect from '@riophae/vue-treeselect'
 // import the styles
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'

 export default {
 // register the component
 components: { Treeselect },data() {
  return {
  // define the default value
  value: null,// define options
  options: [ {
   id: 'a',label: 'a',children: [ {
   id: 'aa',label: 'aa',},{
   id: 'ab',label: 'ab',} ],{
   id: 'b',label: 'b',{
   id: 'c',label: 'c',}

 },}
</script>

更多教程點選《Vue.js前端元件學習教程》，歡迎大家學習閱讀。

關於vue.js元件的教程，請大家點選專題vue.js元件學習教程進行學習。

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。