关于vue.js:vue-静态路由

能够联合动静路由一起应用

  • js part
//1.定义内容
var routes = [
    { path: '/', name: 'HelloWorld', component: HelloWorld },
    { path: '/stu', name: 'Stu', component: Stu },
    { path: '/person', name: 'Person', component: Person },
    { path: '/job', name: 'Job', component: Job },
    { path: '/jobAllot', name: 'JobAllot', component: JobAllot },
    { path: '/notice', name: 'Notice', component: Notice },
    { path: '/expressInspect', name: 'ExpressInspect', component: ExpressInspect }
    
    
];


//2.申明
var router = new VueRouter({
    mode: 'history',
  routes:routes
});

//3.调用
Vue.use(VueRouter);

export default {
  router: router,
  name: 'App',
  components: {
  }
}
  • 页面内容
<router-link to="/stu">stu</router-link>,
        <router-link to="/person">person</router-link>,
        <router-link to="/job">job</router-link>,
        <router-link to="/jobAllot">jobAllot</router-link>,
        <router-link to="/notice">notice</router-link>,
        <router-link to="/expressInspect">ExpressInspect</router-link>,
        
        <hr>
    <router-view>Emp.vue</router-view>

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理