Vue 2 Larabel 5.3 웅변가가 개체에서 데이터를 검색할 수 없음

Vue 2 Larabel 5.3 웅변가가 개체에서 데이터를 검색할 수 없음

Vue2는 지금까지 웅변적인 글을 꽤 잘 읽어왔지만 디버깅하기 힘든 이 점을 제외하곤요.

숍쇼.표시하다

<template>
.....
.....
    <div class="row">
      {{shop.user.id}}
    </div>
.....
.....
</template>

<script>
  export default{
    mounted(){
        this.getShop()
    },
    methods:{
        getShop(){
            var vm = this
        vm.$http.get('/getShop/'+vm.shopId).then((response)=>{
            vm.shop = response.data.data.shop
        })
    },
.....
.....
 }
</script>

Shop Controller.php

.....
.....
    public function getShop($id)
    {
      $shop = Shop::where('id',$id)->with('user')->firstOrFail();
      $response = [
          'data' => [
              'shop' => $shop
          ]
      ];
      return response()->json($response);
    }
.....
.....

web.interface

Route::get('/getShop/{id}', 'ShopController@getShop');

여기서 내가 렌더링할 때{{shop.user}}내 템플릿에서는 다음과 같은 정보를 포함한 사용자의 완벽한 객체를 제공합니다.id그리고.name단, 할 때는{{shop.user.id}}또는{{shop.user.name}}다음과 같은 로그 오류를 콘솔합니다.

에러#1

[Vue warn] :/Applications/XAMPP/xamppfiles/htdocs/soyeg/resources/js/components/Shop/Show에서 컴포넌트를 렌더링할 때 오류가 발생했습니다.vue:

에러 #2

수집되지 않은 유형 오류: VueComponent에서 Proxy.render(app.js:335), :46:47)에 정의되지 않은 속성 'id'를 읽을 수 없습니다.Vue._render(valuate at (app.js:444), :3096:22), VueComponent.eval(valuate at (app.js:444), :2464:21), Watcher.get(valuate at (app.js:444), :1663:27)의 새로운 Watcher(value (valu.js:14), v.js:44:1255), vp.j:24:24:24:24:24:24:24:24:45), vp.valuVue._mount(평가: (app.js:444), :2463:19).Vue$3.$mount(VueComponent에서 (app.js:444), :6104:15로 평가).vue$3.$mount(app.js:444에서 평가), :8494:16에서 평가(app.js:444에서 평가), :2777:11에서 평가(app.js:444에서 평가), :41:20:9)

이런 일은 처음이야, 정말 이상해제발 도와주세요.

로드하는 동안vm.shop부터getShopmethod(비동기 방식)는 비동기 방식이며,vm.shop이 에러는 처음에 표시됩니다.

이 오류를 방지하려면 v-if를 사용하여 사용하기 전에 다음과 같이 null 검사를 수행할 수 있습니다.

<template>
.....
.....
    <div class="row" v-if="shop && shop.user">
      {{shop.user.id}}
    </div>
.....
.....
</template>

언급URL : https://stackoverflow.com/questions/41994003/vue-2-laravel-5-3-eloquent-unable-to-retrieve-data-from-object