如何使用 Nativescript Vue 和 Axios 显示 API 数据答案

【问题标题】：How to display API data using Nativescript Vue and Axios如何使用 Nativescript Vue 和 Axios 显示 API 数据
【发布时间】：2018-09-20 00:01:54
【问题描述】：

下面的代码在网络浏览器中工作，我可以用 v-for 检索 json 数据：

export default {
  data() {
    return {
      orders: []
    }
  },


  created() {
    axios.get('https://development.octavs.com/testapi.json')
    .then(response => {
         this.orders = response.data
    })
    .catch(error => {
      console.log(error);
    })
    }
}

所以我在 nativescript vue 中尝试这样的 ListView ：

<ListView class="list-group" for="order in orders" @itemTap="onItemTap" style="height:1250px">
          <v-template>
            <FlexboxLayout flexDirection="row" class="list-group-item">
              <Label :text="order.store" class="list-group-item-heading" style="width: 40%" />
             
              <Label :text="order.description" class="list-group-item-heading" style="width: 60%" />
            </FlexboxLayout>
          </v-template>
        </ListView>

但它根本不检索数据，也没有错误消息。

有什么需要补充的吗？

我正在使用带有路由器的 nativescipt-vue cli 模板，所以我已经插入了这些依赖项：

从'axios'导入axios；

从'vue-axios'导入VueAxios；

Vue.use(VueRouter, VueAxios, axios);

【问题讨论】：

标签： vue.js nativescript axios

【解决方案1】：

原来我只需要输入： import axios from ‘axios’;在实际页面/组件中

<script>
import axios from 'axios';

  export default {
    data () {
      return {
…
…

【讨论】：