无法加载“道具”数据

Question

在我的项目中，我从下一页（在Axios的帮助下）下载数据：

  

http://seo-gmbh.eu/json/api_sunds.php?action=init_data_for_index

数据用于我的主页。

之后，我尝试将这些数据通过“道具”传递到我的中心内容组件。

我的Vue调试器向我显示它已经正确完成：

但是在我的中心内容组件中，我无法获取此数据以将其显示在我的HTML代码中。

我可以得到部分数据，例如：dbIndex.data

但是，如果我尝试像下面这样更深入地了解道具数据：dbIndex.data.init_data_for_index

显示以下错误：

  

无法读取未定义的属性'init_data_for_index'。

我的问题是：

我该如何正确获取这些数据？

import LiServiceApp from '~/components/CenterContentIndexApp/LiServiceApp';
  export default {
    props: ['dbIndex'],
    components: {
      LiServiceApp,
    }
  }
}

<template>
 <section class="center_content_index">
    <ul class="ul_1">
        <li class="li_3">
          {{  dbIndex.data.init_data_for_index  }}
        </li>
    </ul>
    <!--  <ul class="ul_1"> end -->
  </section>
</template>

Answer 1

尝试以下代码：

<li class="li_3">
  {{ init_data_for_index }}
</li>


...


computed() {

  init_data_for_index() {
    return this.dbIndex && this.dbIndex.data && this.dbIndex.data.init_data_for_index
      ? this.dbIndex.data.init_data_for_index
      : [];
  },

},

因此，init_data_for_index最初是一个空数组，直到从API填充为止。