From 706e17c49c5f85936c9c37b0d133d41aae656f82 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=87=95=E9=B9=8F?= <mail_yanpeng@163.com>
Date: Tue, 20 Oct 2020 17:02:01 +0800
Subject: [PATCH] vue router

---
 .meteor/packages                |  2 ++
 .meteor/versions                |  2 ++
 client/main.js                  |  8 ++++++++
 client/routes.js                | 21 +++++++++++++++++++++
 imports/ui/App.vue              |  2 +-
 imports/ui/components/Hello.vue |  8 ++++++++
 imports/ui/views/Home.vue       | 15 +++++++++++++++
 imports/ui/views/Page.vue       | 15 +++++++++++++++
 package.json                    |  6 ++++--
 9 files changed, 76 insertions(+), 3 deletions(-)
 create mode 100644 client/routes.js
 create mode 100644 imports/ui/views/Home.vue
 create mode 100644 imports/ui/views/Page.vue

diff --git a/.meteor/packages b/.meteor/packages
index cd6d70f..4758bbb 100644
--- a/.meteor/packages
+++ b/.meteor/packages
@@ -22,3 +22,5 @@ akryum:vue-component    # Vue-CLI template to publish components
 
 meteortesting:mocha               # A package for writing and running your meteor app and package tests with mocha
 johanbrook:publication-collector  # Test a Meteor publication by collecting its output
+#kadira:flow-router
+akryum:vue-router2
diff --git a/.meteor/versions b/.meteor/versions
index 32c30a5..e74b1e4 100644
--- a/.meteor/versions
+++ b/.meteor/versions
@@ -1,6 +1,8 @@
+akryum:npm-check@0.1.2
 akryum:vue-component@0.15.2
 akryum:vue-component-dev-client@0.4.7
 akryum:vue-component-dev-server@0.1.4
+akryum:vue-router2@0.2.3
 allow-deny@1.1.0
 autoupdate@1.6.0
 babel-compiler@7.5.3
diff --git a/client/main.js b/client/main.js
index 244595f..77bbae2 100644
--- a/client/main.js
+++ b/client/main.js
@@ -1,12 +1,20 @@
 import Vue from 'vue'
+import { RouterFactory, nativeScrollBehavior } from 'meteor/akryum:vue-router2'
 
 import '../imports/ui/plugins'
+import './routes'
 
 import App from '../imports/ui/App.vue'
 
 Meteor.startup(() => {
+  const routerFactory = new RouterFactory({
+    mode: 'history',
+    scrollBehavior: nativeScrollBehavior,
+  })
+  const router = routerFactory.create()
   new Vue({
     el: '#app',
+    router: router,
     ...App,
   })
 })
diff --git a/client/routes.js b/client/routes.js
new file mode 100644
index 0000000..8a9fe45
--- /dev/null
+++ b/client/routes.js
@@ -0,0 +1,21 @@
+// Import the router
+import { RouterFactory } from 'meteor/akryum:vue-router2'
+
+// Components
+import Home from '/imports/ui/views/Home'
+import Page from '/imports/ui/views/Page.vue'
+
+RouterFactory.configure(factory => {
+    factory.addRoutes([
+        {
+            path: '/',
+            name: 'home',
+            component: Home,
+        },
+        {
+            path: '/page',
+            name: 'page',
+            component: Page,
+        },
+    ])
+})
\ No newline at end of file
diff --git a/imports/ui/App.vue b/imports/ui/App.vue
index e126098..024f238 100644
--- a/imports/ui/App.vue
+++ b/imports/ui/App.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
-    <h1>Welcome to Meteor!</h1>
     <hello/>
     <info/>
+    <router-view></router-view>
   </div>
 </template>
 
diff --git a/imports/ui/components/Hello.vue b/imports/ui/components/Hello.vue
index 64947eb..5ff57aa 100644
--- a/imports/ui/components/Hello.vue
+++ b/imports/ui/components/Hello.vue
@@ -1,6 +1,8 @@
 <template>
   <div>
     <button @click="increment">Click Me</button>
+    <button @click="routeHandler">router page</button>
+    <button @click="goback">go back</button>
     <p>You've pressed the button {{counter}} times.</p>
   </div>
 </template>
@@ -15,6 +17,12 @@ export default {
   methods: {
     increment() {
       this.counter += 1
+    },
+    routeHandler(){
+      this.$router.push("/page")
+    },
+    goback(){
+      this.$router.go(-1)
     }
   },
 }
diff --git a/imports/ui/views/Home.vue b/imports/ui/views/Home.vue
new file mode 100644
index 0000000..5e89cce
--- /dev/null
+++ b/imports/ui/views/Home.vue
@@ -0,0 +1,15 @@
+<template>
+  <div>
+    home
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Home"
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/imports/ui/views/Page.vue b/imports/ui/views/Page.vue
new file mode 100644
index 0000000..27c0230
--- /dev/null
+++ b/imports/ui/views/Page.vue
@@ -0,0 +1,15 @@
+<template>
+  <div>
+    page
+  </div>
+</template>
+
+<script>
+export default {
+name: "Page"
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/package.json b/package.json
index c2c2342..ffcd4b4 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,8 @@
     "@babel/runtime": "^7.11.2",
     "meteor-node-stubs": "^1.0.1",
     "vue": "^2.6.12",
-    "vue-meteor-tracker": "^2.0.0-beta.5"
+    "vue-meteor-tracker": "^2.0.0-beta.5",
+    "vue-router": "^3.0.0"
   },
   "meteor": {
     "mainModule": {
@@ -20,5 +21,6 @@
       "server": "server/main.js"
     },
     "testModule": "tests/main.js"
-  }
+  },
+  "devDependencies": {}
 }