diff --git "a/\350\201\202\350\215\243\347\247\200/2021-6-15.md" "b/\350\201\202\350\215\243\347\247\200/2021-6-15.md"
new file mode 100644
index 0000000000000000000000000000000000000000..34c73137bac9d33965987ec092ca0a57874f7de5
--- /dev/null
+++ "b/\350\201\202\350\215\243\347\247\200/2021-6-15.md"
@@ -0,0 +1,78 @@
+
+## 路由
+### main.js文件
+```
+import Vue from 'vue'
+import App from './App.vue'
+import VueRouter from 'vue-router'
+import login from './components/Login'
+import Abody from './components/Abody'
+
+Vue.config.productionTip = false
+
+Vue.use(VueRouter)
+Vue.use(login)
+Vue.use(Abody)
+
+//创建router实例，传‘routes’配置
+let router=new VueRouter({
+  mode:'history',
+  //定义路由
+  routes:[
+    {
+      path:'/login',
+      component:login
+    },
+    {
+      path:'/body',
+      component:Abody
+    }
+
+  ]
+})
+new Vue({
+  router,
+  render: h => h(App),
+}).$mount('#app')
+```
+
+### App.vue文件
+```
+<template>
+  <div id="app">
+    <img alt="Vue logo" src="./assets/logo.png">
+    <HelloWorld msg="Welcome to Your Vue.js App"/>
+    <!-- 路由出口，路由匹配到的组件渲染在这里 -->
+    <router-view></router-view>
+    <!-- 这是一个‘<a>’标签，用‘to’属性指定链接 -->
+    <router-link to="/body">跳到身体</router-link>
+  </div>
+</template>
+
+<script>
+import HelloWorld from './components/HelloWorld.vue'
+
+export default {
+  name: 'App',
+  components: {
+    HelloWorld
+  }
+}
+</script>
+
+<style>
+#app {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+  margin-top: 60px;
+}
+</style>
+```
+### 两个Vue文件
+
+![](./img/2021-06-18_img1.png)
+
+
diff --git "a/\350\201\202\350\215\243\347\247\200/2021-6-16.md" "b/\350\201\202\350\215\243\347\247\200/2021-6-16.md"
new file mode 100644
index 0000000000000000000000000000000000000000..9a6949a5ce2762f00d70ab1f911eaac0494bd05a
--- /dev/null
+++ "b/\350\201\202\350\215\243\347\247\200/2021-6-16.md"
@@ -0,0 +1,2 @@
+
+## 动态路由匹配
\ No newline at end of file
diff --git "a/\350\201\202\350\215\243\347\247\200/2021-6-18.md" "b/\350\201\202\350\215\243\347\247\200/2021-6-18.md"
new file mode 100644
index 0000000000000000000000000000000000000000..b173c9a1e0584736704bb97c28a6550d5f6552bb
--- /dev/null
+++ "b/\350\201\202\350\215\243\347\247\200/2021-6-18.md"
@@ -0,0 +1,2 @@
+
+## 编程式的导航 $router.push()
\ No newline at end of file
diff --git "a/\350\201\202\350\215\243\347\247\200/2021-6-19.md" "b/\350\201\202\350\215\243\347\247\200/2021-6-19.md"
new file mode 100644
index 0000000000000000000000000000000000000000..c3cc43026fc4c48ed62e87002c5686f4d7c7a8c4
--- /dev/null
+++ "b/\350\201\202\350\215\243\347\247\200/2021-6-19.md"
@@ -0,0 +1,87 @@
+
+## 命名路由和命名视图
+1. App.vue文件
+```
+<template>
+  <div id="app">
+    <router-view></router-view>
+    <router-view name="Bar"></router-view>
+    <router-view name="Foo"></router-view>
+
+    <!-- 链接命名路由，跟用router.push()一样 -->
+    <router-link :to="{ name: 'user', params: { id: 113 } }"
+      >查看用户</router-link
+    >
+  </div>
+</template>
+
+<script>
+export default {
+  name: "App",
+  components: {},
+};
+</script>
+
+<style>
+#app {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+  margin-top: 60px;
+}
+</style>
+```
+2. main.js文件
+```
+//引用要用的配置和路由文件
+import Vue from 'vue'
+import App from './App.vue'
+import VueRouter from 'vue-router'
+import Index from './components/Index'
+import Foo from './components/Viewfoo'
+import Bar from './components/Viewbar'
+import User from './components/User'
+
+Vue.config.productionTip = false
+
+//注册路由
+Vue.use(VueRouter)
+Vue.use(Index)
+Vue.use(Foo)
+Vue.use(Bar)
+Vue.use(User)
+
+//定义路由
+let router = new VueRouter({
+  mode: 'history',   //设置路由模式，去除路由上的‘#’，可以手动跳转
+  routes: [
+    //命名视图
+    {
+      path: '/',
+      //一个视图使用一个组件渲染，多个视图就需要多个组件渲染
+      components: {
+        default: Index,    //默认路由
+        Bar: Bar,
+        Foo: Foo
+      }
+    },
+    //命名路由就是个某个路由设置名称
+    {
+      path: '/user/:id',
+      name: 'user',
+      component: User
+    }
+  ]
+})
+
+new Vue({
+  router,
+  render: h => h(App),
+}).$mount('#app')
+```
+3. 四个命名文件
+
+![](./img/2021-06-19_img1.png)
+
diff --git "a/\350\201\202\350\215\243\347\247\200/img/2021-06-18_img1.png" "b/\350\201\202\350\215\243\347\247\200/img/2021-06-18_img1.png"
new file mode 100644
index 0000000000000000000000000000000000000000..b6c5a2a88318f1a7fee69ce7224887cf4465f923
Binary files /dev/null and "b/\350\201\202\350\215\243\347\247\200/img/2021-06-18_img1.png" differ
diff --git "a/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img1.png" "b/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img1.png"
new file mode 100644
index 0000000000000000000000000000000000000000..850559865875d3039f79fb78770b07962caeff03
Binary files /dev/null and "b/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img1.png" differ
diff --git "a/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img2.png" "b/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img2.png"
new file mode 100644
index 0000000000000000000000000000000000000000..870b2d56d32807006e312fc4c2769a48eafe8d17
Binary files /dev/null and "b/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img2.png" differ
diff --git "a/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img3.png" "b/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img3.png"
new file mode 100644
index 0000000000000000000000000000000000000000..ee78efe2303a5b7543b070928fdcd47b8012f729
Binary files /dev/null and "b/\350\201\202\350\215\243\347\247\200/img/2021-06-19_img3.png" differ