ant-design-pro of vue 使用treeselect

1、安裝TreeSelect

yarn add @riophae/vue-treeselect

注意這個地方用yarn安裝，感覺這個yarn命令對沒有任何基礎的人也很友好HAHA

很多教程都是用npm install --save 命令來安裝的，我的問題是安裝完之後，yarn run serve時會提示缺少很多依賴，結合之前寫的安裝vue時出現的問題，強烈推薦大家使用yarn，安裝過程也比npm快很多。（雖然我也不太熟悉npm哈哈）

2、在使用的位置引入

<!-- 1、樹形選框組件-->

<treeselect v-model="value" :multiple="true" :options="options" />


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

  export default {
    // 記得註冊組件
    components: { Treeselect },
    data() {
      return {
        // 初始值
        value: null,
        // 樹形選框的option選項
        options: [ {
          id: 'a',
          label: 'a',
          children: [ {
            id: 'aa',
            label: 'aa',
          }, {
            id: 'ab',
            label: 'ab',
          } ],
        }, {
          id: 'b',
          label: 'b',
        }, {
          id: 'c',
          label: 'c',
        } ],
      }
    },
  }
</script>

具體Treeselect功能可以參考鏈接 https://blog.csdn.net/dream_xun/article/details/83116804 或者官網