TypeScript vue-router.map函數代碼示例

    run: function (app) {

        Vue.config.debug = true;
        Vue.config.async = false;
        
        Vue.use(VueRouter);
        Vue.component('vue-logo', vueLogo);
        Vue.component('materialize-logo', materializeLogo);
        Vue.component('doc-api', docApi);
        Vue.component('doc-sources', docSources);
        Vue.component('doc-snippet', docSnippet);
        Vue.component('doc-tabs', docTabs);

        var router = new VueRouter({
            history: false,
            root: '/'
        });

        router.map(mapping);

        router.start(App, app);
    },

var App = Vue.extend({});
var router = new VueRouter();

Vue.filter('numberDisplay', function (value) {
    if( value < 10 ) {
        value = '0'.concat(value);
    }
    return value;
})

var homeController = require('../controllers/home');

router.map({
    '/': {
        component: homeController
    }
});


router.start(App, '#app')

import Store from './store';
import App from './App';


Vue.use(VueRouter);


const router = new VueRouter();

const approuter = Vue.extend({});



router.map({
    '/': {
        component: App
    }
});






sync(Store, router);

router.start(approuter, '#appContainer'); // must stay after map and syncing

/* eslint-disable no-console */
console.log(Store.state);

import transState from '../states/transactions/state';
import loginState from '../states/login/state';
import dashState from '../states/dashboard/state';

var router = new VueRouter();

router.map({
	'/login': {
		name: 'login',
		component: loginState,
		auth: false
	},
	'/dashboard': {
		name: 'dashboard',
		component: dashState,
		auth: true
	},
	'/transactions': {
		name: 'transactions',
		component: transState,
		auth: true
	}
});

router.beforeEach((trans:any) => {
	if (trans.to.auth && !Auth.isLogged) {
		trans.redirect('/login');
	} else {
		trans.next();
	}

/*
  For components that will be used in html (such as navbar),
  all you need to do is import the file somewhere in your code,
  they are automatically registered when the file is loaded.
  However, if you import the class (ex: import { Navbar } from './navbar'),
  you will have to call new Navbar() somewhere as well. You would want
  to do that if you are defining a components{} object in the @VueComponent
  options parameter. 
*/
import './components/navbar/navbar'

import { HomeComponent } from './views/home/home'
import { AboutComponent } from './views/about/about'

Vue.use(VueRouter);

var app = Vue.extend({});

var router = new VueRouter();

router.map({
  '/' : {
      component: HomeComponent
  },
  '/about' : {
      component: AboutComponent
  }
});

router.start(app, '#app-main');

import * as VueResource from 'vue-resource'

import './transition/fade'

import { store } from './vuex/store'

import RouterConfig from "./config/route-config"
import Navigation from './component/navigation/navigation'

// Main styles, these styles will be applied globally, each component will get it's own styles
require('./style/main.scss')

// Install Vue Plugins
Vue.use(VueResource)
Vue.use(VueRouter)

// Extend Vue to create a named instance for our app
var app:VueStatic = Vue.extend({
	store: store,
	components: { Navigation }
})

// Define the router
var router = new VueRouter({
	history: true
})

// Map RouterConfig and start the app
router.map(RouterConfig.map)
router.start(app, '#app')

import * as Vue from 'vue';
import * as VueRouter from 'vue-router';
import MainPage from './components/main/index';
import TodoPage from './components/todolist/index';
// import appHtml from require('./app.html!text');
// import html  from 'text-load/app';
import * as appHtml from 'text-load/app.html';

Vue.use(VueRouter);

let router = new VueRouter();

let App: vuejs.VueStatic = Vue.extend({
    template: appHtml,
});
router.map({
    '/': {
        component: MainPage,
    },
    '/todolist': {
        component: TodoPage,
    }
})



router.start(App, document.querySelector('#app'));