vue三级数据获取不到怎么解决

<template>
  <ul>
    <li v-for="item in data" :key="item.id">
      {{ item.label }}
      <tree-view v-if="item.children" :data="item.children"></tree-view>
    </li>
  </ul>
</template>

<script>
export default {
  name: "TreeView",
  props: {
    data: {
      type: Array,
      required: true,
    },
  },
};
</script>

<template>
  <div>
    <ul>
      <li v-for="item in firstLevelData" :key="item.id">
        {{ item.label }}
        <ul>
          <li v-for="secondItem in item.children" :key="secondItem.id">
            {{ secondItem.label }}
            <ul>
              <li v-for="thirdItem in secondItem.children" :key="thirdItem.id">
                {{ thirdItem.label }}
              </li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Tree",
  props: {
    data: {
      type: Array,
      required: true,
    },
  },
  computed: {
    firstLevelData: function () {
      return this.data.filter((item) => item.level === 1);
    },
  },
};
</script>

// state
state: {
  firstLevelData: [],
  secondLevelData: [],
  thirdLevelData: [],
},
// mutations
mutations: {
  SET_FIRST_LEVEL_DATA: (state, data) => {
    state.firstLevelData = data;
  },
  SET_SECOND_LEVEL_DATA: (state, data) => {
    state.secondLevelData = data;
  },
  SET_THIRD_LEVEL_DATA: (state, data) => {
    state.thirdLevelData = data;
  },
},
// actions
actions: {
  fetchData({ commit }) {
    axiOS.get("/api/data").then((res) => {
      commit("SET_FIRST_LEVEL_DATA", res.data.firstLevel);
      commit("SET_SECOND_LEVEL_DATA", res.data.secondLevel);
      commit("SET_THIRD_LEVEL_DATA", res.data.thirdLevel);
    });
  },
},