diff --git "a/\345\260\271\345\260\221\347\232\207/note 2021-06-09.md" "b/\345\260\271\345\260\221\347\232\207/note 2021-06-09.md"
index c0a714d1f4f646da35fe17daf6bf1b0270e25b69..06f959c5d2c84533bcb7915d10b257820be34368 100644
--- "a/\345\260\271\345\260\221\347\232\207/note 2021-06-09.md"
+++ "b/\345\260\271\345\260\221\347\232\207/note 2021-06-09.md"
@@ -4,25 +4,26 @@
```
npm i -g yarn
```
-### 2.进入计算属性设置环境变量 C:\Users\Administrator\AppData\Roaming\npm
-### 3.设置淘宝镜像
+
+### 2.设置淘宝镜像
```
yarn config set registry https://registry.npm.taobao.org
+
```
-### 4.安装Vue脚手架
+### 3.安装Vue脚手架
```
yarn global add @vue/cli
```
-### 5.再次进入环境变量设置C:\Users\Administrator\AppData\Local\Yarn\bin
-### 6.创建文件夹
+### 4.再次进入环境变量设置C:\Users\Administrator\AppData\Local\Yarn\bin
+### 5.创建文件夹
```
vue create 文件夹名
```
-### 7.进入nodejs终端打包文件
+### 6.进入nodejs终端打包文件
```
npm run build
```
-### 8.进入Xshell输入代码指令
+### 7.进入Xshell输入代码指令
```
cd /var/www
mkdir project
@@ -31,10 +32,10 @@ cd /etc/nginx
vim /etc/nginx/conf.d/project.conf
```
-### 9.将打包好的dist中的文件传入新建的文件夹中
+### 8.将打包好的dist中的文件传入新建的文件夹中
```
nginx -t
nginx -s reload
```
-### 10.进入C:\Windows\System32\drivers\etc\host添加主体最后添加公网IP与新建文件名
+### 9.进入C:\Windows\System32\drivers\etc\host添加主体最后添加公网IP与新建文件名
\ No newline at end of file
diff --git "a/\345\260\271\345\260\221\347\232\207/note 2021-06-15.md" "b/\345\260\271\345\260\221\347\232\207/note 2021-06-15.md"
new file mode 100644
index 0000000000000000000000000000000000000000..a0a5e96218de6ddf95d57ccfd1247be55ce0ab68
--- /dev/null
+++ "b/\345\260\271\345\260\221\347\232\207/note 2021-06-15.md"
@@ -0,0 +1,32 @@
+# 课堂笔记_13
+## Vue的学习（单文件组件学习）
+### 1.添加依赖router
++ yarn add vue-router
+### 2.在main.js中引入
++ import VueRouter from 'vue-router'
++ Vue.use(VueRouter)
+### 3.引入模块 如：
+```
+import HelloWorld from './components/HelloWorld.vue'
+import Login from './components/Login.vue'
+
+```
+```
+//注意router的写法
+let router=new VueRouter({
+ mode:'history',
+ routes:[
+ {
+ path:'/',
+ component:Login
+ },
+ {
+ path:'/hello',
+ component:HelloWorld
+ }
+ ]
+})
+```
+### 4.使文件组件通过路由引入模块显示视图
++ "router-view"
+### 5.'(router-link to="/")'为超链接跳转
diff --git "a/\345\260\271\345\260\221\347\232\207/note 2021-06-16.md" "b/\345\260\271\345\260\221\347\232\207/note 2021-06-16.md"
new file mode 100644
index 0000000000000000000000000000000000000000..d294df127c7bc0f5483d827ec089ef6ccbb832dd
--- /dev/null
+++ "b/\345\260\271\345\260\221\347\232\207/note 2021-06-16.md"
@@ -0,0 +1,48 @@
+# 课堂笔记_14
+## Vue路由的学习（第二次）
+### 动态路由匹以冒号开头的动态路径,在Login.vue文件中：
+
+```
+{{ $route.params.id }}
+```
+### 在main.js文件中
+```
+{
+ path:'/login/:id',
+ component:Login,
+},
+```
+### 捕获所有路由404通配符 (*),所有找不到的路由都跳转至fof
+```
+{
+ path:'*',
+ component:fof
+}
+```
+### 嵌套路由,由主组件嵌套子组件获取，要在主组件里添加(router-view)顶层出口
+```
+{
+ path:'/login',
+ component:Login,
+ children:[
+ {
+ path:'child',
+ component:child
+ }
+ ]
+},
+```
+### 当出现以下这种状况，优先以冒号开头的动态路径
+```
+{
+ path:'/login/:id',
+ component:Login,
+ children:[
+ {
+ path:'child',
+ component:child
+ }
+ ]
+},
+```
+### iCSS：https://github.com/chokcoco/iCSS/
\ No newline at end of file
diff --git "a/\345\260\271\345\260\221\347\232\207/note 2021-06-18.md" "b/\345\260\271\345\260\221\347\232\207/note 2021-06-18.md"
new file mode 100644
index 0000000000000000000000000000000000000000..c2f96e61df8e0d2b440d7bde791423b2a9efba6c
--- /dev/null
+++ "b/\345\260\271\345\260\221\347\232\207/note 2021-06-18.md"
@@ -0,0 +1,35 @@
+# 课堂笔记_15
+## Vue-router的学习（第三次课）
+### 编程式导航
+### router.push() 点击(router-link :to="...")相当于调用router.push(...)
+```
+{
+ path:'/hello/:id',
+ name:'hello',
+ component:HelloWorld
+}
+
+
+mounted: function () {
+setTimeout(() => {
+ if (this.$route.to !== "/hello") {
+ //自动跳转
+ this.$router.push(`hello/123`);
+ }
+}, 2000);
+},
+```
+### 使用path时params 不生效提供了 path，params 会被忽略
+```
+this.$router.push({
+ path: `hello`,
+ query: { plan: id }
+});
+```
+### router.push()
+```
+this.$router.push({
+ name: `hello`,
+ params: { id }
+});
+```
\ No newline at end of file
diff --git "a/\345\260\271\345\260\221\347\232\207/note 2021-06-19.md" "b/\345\260\271\345\260\221\347\232\207/note 2021-06-19.md"
new file mode 100644
index 0000000000000000000000000000000000000000..454b5d395c9bf248f71535e30ff7d277448a702f
--- /dev/null
+++ "b/\345\260\271\345\260\221\347\232\207/note 2021-06-19.md"
@@ -0,0 +1,72 @@
+# 课堂笔记_16
+## Vue-router学习（第四次课）
+### 命名路由，命名视图
+### 给路由一个名称作为它的标识，在使用router-link :to时就可以通过名称查找路由
+```
+{
+ path:'/hello/:id',
+ name:'hello',
+ components:{
+ Hello:HelloWorld
+ }
+},
+
+进入黄泉路
+```
+### 命名视图在同一个路由底下有多个组件模块就可以通过名称显示出来
+```
+{
+ path:'/',
+ name:'Login',
+ components:{
+ login:Login,
+ user:User
+ }
+},
+
+//在App.vue中的视图出口
+
+
+
+```
+### 嵌套命名视图:
+### App.vue:
+```
+
+```
+### HelloWorld.vue:
+```
+
+
+
+```
+```
+{
+ path:'/',
+ name:'Login',
+ component:HelloWorld,
+ children:[
+ {
+ path:'chilone',
+ component:Login
+ },
+ {
+ path:'chiltwo',
+ components:{
+ user:User,
+ one:One
+ }
+ }
+ ]
+},
+```
+### 重定向：通过 routes 配置来完成，下面例子是从 /a 重定向到 /b
+```
+{ path: '/a', redirect: '/b' }
+
+```
+### 别名:当用户访问 /b 时，URL 会保持为 /b，但是路由匹配则为 /a，就像用户访问 /a 一样
+```
+{ path: '/a', component: A, alias: '/b' }
+```
+