爲什麼有一個Observer而不是我的數組？

Question

我Vue的組件由即驗證碼：

<script> 
export default { 
    data() { 
    return { 
     sailNames: [] 
    } 
    }, 
    methods: { 
    showName: function(e) { // [3] called by @click event from DOM 
     console.log(this.sailNames); // [4] shows: [__ob__: Observer] 
    }, 
    getJsonData() { // [1] called on created() hook 
     $.getJSON("./src/res/sails.json", function(data) { 
     const sailNames = []; 
     $.each(data, function(i, names) { 
      sailNames.push(names); 
     }); 
     this.sailNames = sailNames; 
     console.log(this.sailNames); 
     console.log(sailNames); // [2] both logs give the same output 
     }); 
    } 
    } 
} 
(...) 

我想知道，爲什麼我點登錄狀態時，得到這個[__ob__: Observer] [4]。正如你所看到的，數組在data部分定義，然後它從局部變量獲取值並進行檢查：本地和全局變量都是相同的（點[2]）。

然後，當用戶點擊showName分配的方法（pt。[3]）時，我希望看到與pt相同的輸出。 [2]，但是[__ob__: Observer]出現在控制檯中。

發生了什麼？我應該如何調用數組來獲取它的值？

Answer 1

<script> 
export default { 
    data() { 
    return { 
     sailNames: [] 
    } 
    }, 
    methods: { 
    showName(e){ 
     console.log(this.sailNames); 
    }, 
    getJsonData() { 
     $.getJSON("./src/res/sails.json", (data) => { 
     const sailNames = []; 
     $.each(data, function(i, names) { 
      sailNames.push(names); 
     }); 
     this.sailNames = sailNames; 
     }); 
    } 
    } 
} 
</script>