vue.js 无法读取未定义的属性“_normalized”

qij5mzcb  于 2023-03-03  发布在  Vue.js
关注(0)|答案(2)|浏览(259)

当我尝试在nuxtjs中获取一些数据时,显示此错误

Cannot read property '_normalized' of undefined

这是我在nuxtjs中的axios请求:

async asyncData({app}){
        var response = await app.$axios.get('/store/get-services',{params:{id:app.$auth.user.store.id}});
        return {services:response.data.services};
    }

这是一个后端控制器laravel:

public function store_ads(Request $req){
    if($req->user()->store->id != $req->id){
        abort(403);
    }
    $services = Store::select('id')->with('ads:id,store_id,price,title')->where('id',$req->id)->first();
    return response()->json(['services'=>$services],200);
}

下面是我如何在我的模板中获取它们:

<div class="services-list">
                        <h4 class="is-vcentered title has-text-centered has-text-grey-light" v-if="services.ads.length==0">No Services</h4>
                        <ul>
                            <li v-for="service in services.ads" :key="service.id"><nuxt-link>{{service.title}}</nuxt-link></li>
                        </ul>
                    </div>

原因何在?

vaj7vani

vaj7vani1#

错误是我没有为<nuxt-link></nuxt-link>传递to属性,这就是导致此错误的原因

mu0hgdu0

mu0hgdu02#

有同样的错误信息。改变v-for-循环中的顺序为我解决了问题。
在我的v-for看起来像这样之前:

<NuxtLink v-for="(key, highlight) in highlights" :key="key" :to="highlight.url">
{{ highlight.title }}
</NuxtLink>

我将属性的顺序更改为:

<NuxtLink v-for="(highlight, key) in highlights" :key="key" :to="highlight.url">
{{ highlight.title }}
</NuxtLink>

注意:我将Vue.js与Nuxt.js一起使用

相关问题