Question

我是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
 }

如何在component / 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>

Answer 1

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

您将components/Stores.vue lojas道具绑定到pages/index.vue stores吗？

在您的pages/index.vue中，它应该看起来像

<stores :lohas="stores" />

Nuxtjs Axios模块，在子组件处获取数据

1 个答案: