問題：在用到ant-design-vue中的 a-tree 樹形控制元件展示選單列表，以及進行操作列表。需要在加載出列表時，同時展開所有的樹節點

使用defaultExpandAll屬性 ，但是一直不生效，template中的程式碼如下：

<a-tree
  default-expand-all
  :tree-data="adminMenuList"
  :show-line="true"
>
</a-tree>

script 中的程式碼如下：

import { getAdminMenuListApi } from '@/api/admin'
export default
 
 {
  data() {
    return {
      adminMenuList: []
    };
  },
  methods: {
    getAdminMenuList() {
      getAdminMenuListApi().then(res => {
        this.adminMenuList = res.data;
      });
    }
  },
  mounted() {
    this.getAdminMenuList();
  }
};

頁面展示：

 原因：因為default-expand-all屬性是用來設定預設值的，不會動態渲染，初始值adminMenuList的資料

解決：加v-if判斷，資料請求回來之後再去渲染 a-tree 樹形控制元件

修改之後的程式碼：

<a-tree
  default-expand-all
  :tree-data="adminMenuList"
  :show-line="true"
  v-if="!spinning"
>
  <a-spin :spinning="spinning">
</a-tree>

import { getAdminMenuListApi } from '@/api/admin'
export default {
  data() {
    return {
      adminMenuList: [],
      spinning: true
    };
  },
  methods: {
    getAdminMenuList() {
      getAdminMenuListApi().then(res => {
        this.adminMenuList = res.data;
        this.spinning = false;
      });
    }
  },
  mounted() {
    this.getAdminMenuList();
  }

資料返回之前先顯示載入中狀態，返回之後根據spinning的值再渲染 a-tree 元件，問題解決，如下圖