2017-03-27 6 views
0

VUE 중첩 된 객체의 속성에 액세스 할 수 없습니다 그것은 내 Datatable Vue 구성 요소에 소품으로 전달됩니다. 내 Datatable 구성 요소에서 console.log "테이블"개체를 만들려고 할 때 "데이터"및 "페이지 매김"속성에 값이있는 것을 볼 수 있지만 "this.table.data"를 사용하여 액세스하려고하면 볼 수 있습니다. 여기 는 <p></p> 내가 "데이터"와 "페이지 매김"특성을 가진 개체라는 이름의 "표"가 .. 내가 아주 가끔은 지금은 뷰를 사용하지만 내 객체의 특정 속성에 액세스에 문제가 오전

내 테이블 개체의 구조 0 값은 .. :

table : { 
    data : array[7], 
    paginate: Object 
} 

는 뷰 인스턴스의 "산"에 this.table.data에 액세스하려고합니다.

도움 주셔서 감사합니다.

구성 요소 코드 :

<script> 
window.Event = new Vue(); 

export default { 

props: { 
     tableid: String, 
     settings: Object, 
     table: Object, 
    }, 
mounted: function(){ 
    console.log(this.table); 
} 
</script> 
+0

좀 더 코드를 볼 필요가있다. 전체 구성 요소를 보여줄 수 있습니까? – Bert

+0

@BertEvans 님이 질문을 수정했습니다 .. – JCP

+0

바이올린으로이 문제를 입증 할 수 있습니까? 나는 정말로 잘못된 것을 아직 보지 못했다. – Bert

답변

0

Vue.component('table-show', { 
 
    template: '#table-show', 
 
    props: { 
 
    table: Object, 
 
    } 
 
}); 
 

 
new Vue({ 
 
    el: '#app', 
 
    data: { 
 
    tables: [{ 
 
     data: [1, 2, 3], 
 
     paginate: true 
 
    }, { 
 
     data: [4, 5, 6], 
 
     paginate: true 
 
    }, { 
 
     data: [7, 8, 9], 
 
     paginate: false 
 
    }, ], 
 
    } 
 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.5/vue.js"></script> 
 
<template id="table-show"> 
 
    <li>{{table.data}}</li> 
 
</template> 
 

 
<div id="app"> 
 
    <ul> 
 
    <table-show v-for="table in tables" :table="table"></table-show> 
 
    </ul> 
 
    <pre> 
 
    {{$data.tables}} 
 
    </pre> 
 
</div>