VueJS2屬性未定義

我寫了下面的代碼和Vue公司抱怨：VueJS2屬性未定義

[Vue公司提醒]：屬性或方法「事件」未在實例定義，但期間所參考的渲染。確保在數據選項中聲明反應性數據屬性。

我不明白爲什麼不能訪問事件？

var app = new Vue({ 
    el: '#app', 
    data: { 
     responders: [], 
     incidents: [] 
    }, 

    mounted: function() { 
     this.getIncidents(); 
    }, 

    methods: { 
     getIncidents: function() { 
      console.log('getIncidents'); 
      var app = this; 
      this.$http.get('/api/v1/incidents').then(function(response) { 
       // set data 
       var incidentsReceived = response.data.map(function (incident) { 
        return incident; 
       }); 
       Vue.set(app, 'incidents', incidentsReceived); 
      }) 
     }, 

     getResponders: function() { 
      console.log('fetchResponders'); 
      var app = this; 
      this.$http.get('/api/v1/responders').then(function(response) { 
       // set data on vm 
       var respondersReceived = response.data.map(function (responder) { 
        return responder 
       }); 
       Vue.set(app, 'responders', respondersReceived); 
      }); 
     } 
    } 
})

來源

2017-02-06 sesc360

可能創建一個[小提琴]（https://jsfiddle.net/er3tjyh0/）它顯示的問題？ – Saurabh

data是爲內部組件數據建模，而道具，其可以從外部被分配，使用的是爲組件的props鍵定義。

換句話說，嘗試：

var app = new Vue({ 
    ..., 
    props: { 
    incidents: { 
     type: Array, 
     required: false //change this as you see fit. 
    } 
    }, 
    ... 
});

有關組件屬性的完整文檔，請參閱official guide。

來源

2017-02-06 13:35:52

但我沒有定義一個組件，有我嗎？從VueJS1.0開始，我總是將數據打包在我的「數據」容器中，如下所示：'new Vue（{el：'#app'， data：'陛下問候'' }）;'' – sesc360

根vue實例和組件接口屬性的方式相同。我認爲你有某種模板提供屬性值的方式或另一種方式，但它似乎是使用Vue.set（...）時出現錯誤？如果是這樣的話，我不確定你應該使用Vue.set，我想你正在尋找的東西就像'this.incidents'來訪問你''數據'中的'事件'。 –

編輯：沒有很好地閱讀代碼第一次。驗證響應中是否有數據，如果沒有，則不要將其設置爲事件數組。

來源

2017-02-06 13:48:59

我試着用Vue.set的最後一種方法，但我仍然得到這個錯誤。我正在爲回調函數中的變量事件賦值，所以它應該工作？奇怪的是，響應者的功能完美無缺！這是相同的結構，所以我不明白爲什麼事件不起作用，然後 – sesc360

你用自己嘗試？你能否確認你實際上得到了答案中的任何數據，只是爲了確保你在那裏有東西。剛注意到現在你已經設置了應用程序到'this'：D：D –

是不適用於var app = this？是的，數據可用 – sesc360

VueJS2屬性未定義

回答

相關問題