2016-07-06 17 views
0

いくつかの異なるルートにマップされたコンポーネントがいくつかありますが、各ルート用に作成されたコンポーネントが、データのやり取りの観点から兄弟コンポーネントと見なされているのでしょうか?この構造内の親コンポーネントであるコンポーネントは不明である:私はPageOneからHomeルートからのデータを渡したい場合はvue.js内のvue-routerでの兄弟コンポーネントですか?

PageOne = Vue.extend({ 
    template: "#page-one" 
}) 
PageTwo = Vue.extend({ 
    template: "#page-two" 
}) 
Home = Vue.extend({ 
    template: "#home" 
}) 
var router = new VueRouter() 
router.map({ 
    '/': { 
    component: Home 
    }, 
'/PageOne': { 
    component: PageOne 
    }, 
'/PageTwo': { 
    component: PageTwo 
} 
}) 


var App = Vue.extend({}) 
router.start(App, "#app") 

だから、私は、グローバルイベントバスを使用する必要があります、または私がに小道具を使用することができますあるルートから次のルートにデータを渡しますか?ここ はデモです:http://codepen.io/p-adams/pen/kXwxRR

答えて

1

あなたはVuexとグローバルイベントバスや状態管理を使用、またはネストされたルート(http://router.vuejs.org/en/nested.html)としてこれらを設定する必要があり、次のいずれか

router.map({ 
    '/': { 
    component: Home, 
    subRoutes: { 
     '/PageOne': { 
     component: PageOne 
     }, 
     '/PageTwo': { 
     component: PageTwo 
     } 
    } 
    } 
}) 

あなたがそのようにした場合は、あなたの<router-view>に小道具を渡すことができます。

<div id="app"> 
    <router-view :foo="bar"></router-view> 
</div> 

http://router.vuejs.org/en/view.html

関連する問題