Nuxtjs Axios 模块，获取子组件的数据答案

【问题标题】：Nuxtjs Axios module, get data at child componentNuxtjs Axios 模块，获取子组件的数据
【发布时间】：2019-05-17 18:04:32
【问题描述】：

我是 Vue 新手，

我正在使用 NuxtJS 和 axios 模块。

我可以在pages/index.vue 获得我需要的数据，但无法在components/Stores.vue 获得数据

在pages/index.vue 中，我确实使用了async await，并且可以从stores 变量中获取数据。在模板部分，我可以看到 json 值使用：{{stores}}

async asyncData ({$axios}) {
      let stores= await $axios.$get('/stores')
      return {stores}
 }

在components/Stores.vue 我尝试使用props 但无法获取数据，我在模板部分使用{{stores}} 看不到任何内容：

props:{
      lojas: Object
 }

如何在 components/Stores.vue 获得商店？

编辑：现在只需更改顶级 vuex

我的 components/stores.vue 代码我看不到 json 数据，现在我只能在 pages/index.vue 看到数据：

<template>
{{stores}}
</template>
<script>
    export default {
        async fetch({store}){
            await store.dispatch('lojas/fetchAllStores')
        }, 
        computed :{
            stores(){
                return this.$store.state.stores.all
            }
        }
    }
</script>

【问题讨论】：

你的问题不够清楚，你能澄清一下你想要达到的目标吗？
我需要在 components/Stores.vue 获取 Json 数据，我不明白为什么我无法获取它
不确定您的意思，您是否要导入组件？请发布完整的代码示例。
或者，当我有组件时，我看不到如何从该组件内的 axios 获取数据
@DanielOrmeño 我只是添加了 stores.vue 组件代码

标签： vue.js nuxt.js

【解决方案1】：

好吧，如果您需要在多个组件中使用一些数据 - 这是Vuex store 的用例。

你是否将你的 components/Stores.vue lojas 属性绑定到 pages/index.vue stores ？

在你的pages/index.vue 中应该是这样的

<stores :lohas="stores" />

【讨论】：

我刚改成vuex，components/Stores.vue绑定到layouts/index.vue，还是看不到数据，
我使用 pages/index.vue 并组织布局来解决这个问题。在 Nuxtjs 中，我可以在组件中调用 vuex 吗？
是的。在您的组件中，vuex 商店应该可以通过this.$store 获得。