前言:人家都开始上vue3.0了,我还在重学vue2.0,啊这🤡🤡

提醒:个人学习笔记,适合随手翻阅,精读需考量。

1.手摸手(左手摸右手)搭建一个vue的工程,基于vue2.0

🔞🔞🔞🔞🔞

(1)新建一个文件夹😀😀

(2)执行 npm install -g @vue/cli 命令😋😋

(3)执行 vue create vue-demo 命令😥😥

报错了,只需要去 D:\0.node\node_global\vue.ps1 图上报错的这个文件夹中将 vue.ps1 文件删掉再次运行这个命令即可

项目搭建成功

搭建成功😄😄

2.Hello,world!

🤔🤔🤔🤔🤔

(1)运行 cd vue-demo 和 npm run serve 😎😎

此时,按住 ctrl+鼠标点击链接 就可以访问 vue 工程启动起来的页面了

页面上没有 Hello,world! 差评😠😠

(2)自己写 Hello,world! 🤒🤒

修改HelloWorld文件: 修改路由文件: Hello,world!

好了,vue 算是已经进入了解的范围了,写过HelloWorld了,学任何一门语言不写个 Hello,world! 是不完整的,傲娇的野生程序员😒😒

成就达成:了解Vue

3.开始照猫画虎之 CV 大法

🤗🤗🤗🤗🤗

(1)在 compoents 下新建一个 Study.vue 文件

将 HelloWorld.vue 中的文件拷贝过来,删删改改

(2)在 views 文件夹下新建一个 Study.vue 文件

将 Home.vue 中的代码拷贝过来改改

(3)修改 router 下的 index.js

拷贝一下数组里的第一个对象元素,改改

(4)修改 src 根目录下的 App.vue 文件