route selection

by leftstick

HTML

<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/vue-router/dist/vue-router.js"></script>
<script src="//unpkg.com/element-ui/lib/index.js"></script>
<div id="app">
    <el-menu theme="dark" default-active="1" class="el-menu-demo" mode="horizontal" router>
      <el-menu-item index="1" :route="{ path: '/center' }">处理中心</el-menu-item>
      <el-menu-item index="2" :route="{ path: '/order' }">订单管理</el-menu-item>
    </el-menu>
    <router-view id="view"></router-view>
</div>

SCSS

@import url("//unpkg.com/element-ui/lib/theme-default/index.css");

Babel + JSX

var router = new VueRouter({
    routes: [{
        path: '/center',
        component: { template: '<strong>control center</strong>' }
    },
    {
        path: '/order',
        component: { template: '<strong>control management</strong>' }
    }],
    scrollBehavior(to, from, savedPosition) {
      if (savedPosition) {
          return savedPosition;
      }
      return { x: 0, y: 0 };
    }
});


new Vue({
    router: router
  }).$mount('#app')