vue-router引入

@@ -6,7 +6,7 @@
 const wheelSurfModel = require('../models/wheel-surf');
 
 const whSurfController = {
-    page(req, res) {
+    entry(req, res) {
         res.render('activity/wheel-surf', {
             bodyClass: 'nav-md',
             module: 'admin',

@@ -92,6 +92,7 @@ router.get('/api/user/exportPrizeUserList', user.exportPrizeUserList);
 router.get('/api/user/exportInfoUserList', user.exportInfoUserList);
 
 // 大转盘活动管理
-router.get('/wheelSurf', wheelSurf.page);
+router.get('/wheelSurf', wheelSurf.entry);
+router.get('/wheelSurf/*', wheelSurf.entry);
 
 module.exports = router;

 <!-- page content -->
 <div class="right_col" role="main">
     <div id="app">
-          <wheel-surf></wheel-surf>
+          <App></App>
     </div>
 </div>
 <!-- /page content -->

@@ -105,7 +105,8 @@ module.exports = (env) => {
                 path.join(__dirname, '../public/vue')
             ],
             alias:{
-                'vue$':'vue/dist/vue.esm.js'
+                'vue$':'vue/dist/vue.esm.js',
+                'vue@': path.join(__dirname, '../public/vue')
             }
         },
         stats: {

@@ -148,6 +148,7 @@
     "uglifyjs-webpack-plugin": "^0.4.6",
     "vue": "^2.3.3",
     "vue-loader": "^13.7.0",
+    "vue-router": "^3.0.1",
     "vue-template-compiler": "^2.3.3",
     "webpack": "^2.6.1",
     "webpack-bundle-analyzer": "^2.8.2",

 import Vue from 'vue';
-import wheelSurf from 'wheel-surf.vue';
+import VueRouter from 'vue-router';
+import App from 'vue@/App.vue';
+import {create, list} from 'vue@/wheel-surf';
 
 require('admin/wheel-surf.page.css');
 
+Vue.use(VueRouter);
+
+const router = new VueRouter({
+    routes: [
+        {path: '/admin/wheelSurf', component: list},
+        {path: '/admin/wheelSurf/create', name: 'create', component: create}
+    ],
+    mode: 'history'
+});
+
 new Vue({
     el: '#app',
     components: {
-        wheelSurf
-    }
+        App
+    },
+    router
 });
 

+<template>
+   <router-view></router-view>
+</template>
+
+<script>
+    export default {
+        name: 'App'
+    };
+</script>
+
+<style>
+
+</style>

 <template>
     <div>
-        <div>{{test}}</div>
-        <input type="text" v-model="test">
+        创建
     </div>
 </template>
 <script>
     module.exports = {
         data() {
-          return {
-            test: 1
-          };
+            return {
+                test: 1
+            };
         }
     }
-
 </script>
 <style>
 

+import create from './create.vue';
+import list from './list.vue';
+
+export {
+    create,
+    list
+}

+<template>
+    <div>
+        <a @click="create">创建活动</a>
+        活动列表
+    </div>
+</template>
+<script>
+    module.exports = {
+        data() {
+          return {
+            test: 1
+          };
+        },
+        methods: {
+            create() {
+              console.log(this.$router.push)
+              this.$router.push({name: 'create'});
+            }
+        }
+    }
+</script>
+<style>
+
+</style>

@@ -10504,6 +10504,10 @@ vue-loader@^13.7.0:
     vue-style-loader "^3.0.0"
     vue-template-es2015-compiler "^1.6.0"
 
+vue-router@^3.0.1:
+  version "3.0.1"
+  resolved "http://registry.npm.taobao.org/vue-router/download/vue-router-3.0.1.tgz#d9b05ad9c7420ba0f626d6500d693e60092cc1e9"
+
 vue-style-loader@^3.0.0:
   version "3.1.2"
   resolved "http://registry.npm.taobao.org/vue-style-loader/download/vue-style-loader-3.1.2.tgz#6b66ad34998fc9520c2f1e4d5fa4091641c1597a"