如何从 Vue 实例中读取数据答案

【问题标题】：How to read data from a Vue instance如何从 Vue 实例中读取数据
【发布时间】：2019-03-28 03:11:15
【问题描述】：

给定以下代码sn-p：

 var title,description,lng,lat,identifier;
 const details = new Vue({
     el: '#detailsLOC',
     data: {
  resultsONE: [],
  resultsImages: [],
  GeoJsonONE: []
 },
 mounted() {
 axios.all([
     axios.get('/getJsonDetails'),
     axios.get('/getJsonDetailsImages'),
   ]).then(axios.spread((response1,response2) => {
    this.resultsONE = response1.data;
    this.resultsImages = response2.data;
    title = this.resultsONE.title;
    description = this.resultsONE.preview_description;
    lng = this.resultsONE.location_lng;
    lat = this.resultsONE.location_lat;
    identifier = this.resultsONE.identifier;
   })).catch( e => {
   console.log(e);
    document.getElementById("app1").style.display = "none";
    document.getElementById("app2").style.display = "none";
    document.getElementById("app3").style.display = "";
 });
 }
 });

我想从 resultsONE 传输/获取/读取数据并将其保存在 Vue 实例之外（并将其存储在我的示例中的这些变量 lng、lat、title 中...）。两个 axios.get 都是有效的并且可以正常工作。你能帮帮我吗？

【问题讨论】：

details.$data 我相信会起作用的。
但是数据包含3个对象，你确定吗？
vuejs.org/v2/api/#vm-data 检查details.$data 的内容。它将包含您要查找的内容。

标签： javascript html vue.js vuejs2 vue-component

【解决方案1】：

可以通过引用instance.$data来访问vue实例的data对象。
像这样的一个 vue 实例：

var foo = new Vue({
el: "#app",
data() {
  return {
    bar: "inside data"
  };
},

可以通过foo.$data.bar访问。

完整示例：https://codesandbox.io/s/4wwoxzow97

【讨论】：