Vue.js 2將數據從組件傳遞到根實例

我有一個組件發出AJAX請求。在回調函數中，我想將值傳遞迴父或實例。Vue.js 2將數據從組件傳遞到根實例

所以我的例如在組件的回調函數：

export default { 
    name: 'app', 
    data() { 
    return { 
     value : '' 
    } 
    }, 
    methods: { 
    setValue: function(value){ 
     console.log(value); 
    } 
    } 
}

這不：

function callbackFunc(vm, response){ 
    vm.$emit('setValue', response.id); 
}

，在我的root用戶實例，我使用了一個名爲的setValue這樣的方法嘗試工作。該文檔似乎說你需要在模板內部有一個事件，以便它們都可以聯繫起來，但在這種情況下這不起作用。

任何想法？

乾杯！

來源

2017-06-15 BarryWalsh

你能展示更多的代碼嗎？你的回調是如何被調用的等等。 – Bert

它在文件上只是它自己在全球範圍內的一項功能。 vm是對vue實例的引用，因此可以調用$ emit。 – BarryWalsh

如果它在全局範圍內，爲什麼不像'const app = new Vue（...）'和'callbackFunc'中使用'app.setValue（response.id）'。 – Bert

我正在使用vue-router。因此，有有一個App 組件，然後叫你好there'sthe組件，它具有 Ajax調用

在父組件的模板，你將有一個<router-view><\router-view>這哪裏是VUE路由器將會把根元素你的孩子。要連接一切，你需要將指令添加到模板：

<router-view v-on:setValue="parentMethod" ><\router-view>

當孩子調用Ajax調用後$emit("setValue")，它會在父觸發parentMethod()。目前還不清楚爲什麼你說它不能將它與模板掛鉤。沒有模板，就沒有真正的父母/子女關係。

來源

2017-06-15 20:18:24

乾杯！現在試試這個。我得到：屬性或方法「parentMethod」未在實例上定義，但在渲染過程中引用。確保在數據選項中聲明反應數據屬性。 – BarryWalsh

對不起，我解決了這個問題。令人驚歎的，這是有效的！謝謝！我明白現在發生了什麼好轉。我認爲我需要將它綁定爲點擊事件或模糊等。再次感謝！ – BarryWalsh

對不起 - 那還不清楚。我的意思是在你父母的通用方法中使用「parentMethod」。你需要在你的父類上寫這個方法，並把它稱爲parentMethod或甚至是'setValue（）'這個模板告訴你的父組件監聽事件'setValue'，然後在父對象上調用一些方法。 –

Vue.js 2將數據從組件傳遞到根實例

回答

相關問題