2016-05-01 19 views
0

私はシングルページアプリケーションを作成するためにvueルーターを使用しています。私は、メニュー項目をクリックすると対応するページに移動するナビゲーションシステムを持っています。たとえば:その選択したかのように表示されるようにvue-routerを使用すると、どのようにメニューを選択することができますか?

var pageView = require('./components/pageView.vue') 

// Define some components 
var Boards_page = Vue.extend({ 
    template: '<p>Boards</p>' 
}) 

var Fantheories = Vue.extend({ 
    template: '<p>Character</p>' 
}) 

// The router needs a root component to render. 
// For demo purposes, we will just use an empty one 
// because we are using the HTML as the app template. 
// !! Note that the App is not a Vue instance. 
var App = Vue.extend({}) 

// Create a router instance. 
// You can pass in additional options here, but let's 
// keep it simple for now. 
var router = new VueRouter({ 
    history: true 
}) 

// Define some routes. 
// Each route should map to a component. The "component" can 
// either be an actual component constructor created via 
// Vue.extend(), or just a component options object. 
// We'll talk about nested routes later. 
router.map({ 
    '/': { 
     component: pageView 
    }, 
    '/boards': { 
     component: Boards_page 
    }, 
    '/fantheories': { 
     component: Fantheories_page 
    } 
}) 

// Now we can start the app! 
// The router will create an instance of App and mount to 
// the element matching the selector #app. 
router.start(App, '#container') 

私は、メニュー項目によどんなURLように、どのように私はそれを作るだろうが別のCSSスタイルを持っていますか?

答えて

関連する問題