如何訪問在較低（父級）級別聲明的Vue對象的屬性？

在我的index.js我有一個Vue對象，聲明一個路由器並呈現所有頁面的持有者。如何訪問在較低（父級）級別聲明的Vue對象的屬性？

const app = new Vue({ 
    ..., 
    render: _ => _(App), 
    router, 
    ..., 
    el: "#app-base"});

在頁面渲染我有順序有其子等。現在，我想訪問的最外層水平和operate on it in the context of one of the toppy subcomponents宣佈路由器實例的部件。

我該如何做到這一點？

它並不存在於上下文中。我需要以某種方式將它傳遞給樹嗎？什麼會是一個很好的方法來做到這一點？我是否應該避免需要訪問工作組件中的底層聲明實例？

來源

2016-12-09 Konrad Viltersten

在這些情況下，您希望使用[Vuex]（https://github.com/vuejs/vuex）來管理上層組件和下層組件之間的狀態。 – joaumg

您是否打算使用商店來保存路由器的實例？可以做。其他考慮如何？在我看來，**如果**需要在toppy級別訪問路由器，則應考慮採用不同的方法，因爲這意味着開始時會出現不好的設計。我有權被關注嗎？還是一種常見的情況？ –

組件互相溝通是正常的。避免的是範圍混亂，它將變成處理具有相同範圍的多個組件......此外，Vuex添加了一個單點突變，這使得維護更容易。但是，這是我第一次看到一個組件與路由器通信。所以，可能會有另一種選擇（ – joaumg

Vue允許您使用this.$route變量訪問和修改vue組件級別的路由。

但是，這可以通過使用通用方法來修改根級組件的路由以及每當需要更改子組件時進行集中，請使用vue-events調用此根級別的方法。

人們可以在孩子父母直接不訪問數據（有ways，但不推薦），但可調用父的使用$emit的方法，請參閱本fiddle。在vue中，父子通訊的props down, event up

來源

2016-12-11 02:47:44 Saurabh

它解決了我目前的需要。儘管如此，只需快速跟進。當你說「*通過一般方法集中在根級別*」時 - 你是說Vue組件會聲明一個方法，如* ...，方法：{驢：function（）{...}}，... *？我很驚訝，因爲我的印象是，孩子的組件無法從父母那裏獲取東西......當我試圖用* data *做到這一點時，我注意到父母的*數據*在孩子的*數據* ... –

@KonradViltersten，是的，您將不得不在根組件級別定義方法。你不能直接訪問父進程的數據，但你可以使用[$ emit]（https://vuejs.org/v2/api/#vm-emit）調用父進程的方法，參見[fiddle]（https ：//jsfiddle.net/9c9kpdpx/）。在vue中它是[支持，事件]（https://vuejs.org/v2/guide/components.html#Composing-Components）父母子女溝通。 – Saurabh

如何訪問在較低（父級）級別聲明的Vue對象的屬性？

回答

相關問題