以前项目组一直用的angularJS,项目即将转型用vue,所以开启了学习之旅,记录我的学习过程和遇到的问题。
看了很多文章,大致也差不多,直接入正题,下面是我的今天学习记录。
注意:需要安装node,会用到npm,我以前已经搞好了一切,就不写入记录里面了。
1. 打开终端(windows就是命令提示符),生成一个package.json,输入:npm init -y
2. 安装vue输入:npm install vue -->一切正常,无报错。
3. 安装webpack输入:npm install webpack -g -->nice,无报错
4. 全局安装vue-cli构建工具输入:npm install --global vue-cli
emmmm..报错了!权限问题,重来!
从新输入:sudo npm install --global vue-cli --->nice!安装完成。
5. 现在就使用vue-cli 来构建项目,新建一个项目文件,并终端找到项目所在位置(我是直接webstrom打开这个文件夹,打开项目terminal终端)
输入命令:vue init web pack my-vue --->依次键入问题的答案,看图:⬇️
然后就会出现下面的提示,就表明咱们创建vue项目成功了!!
—————————————————————————————————————————————————————————
创建vue项目成功之后,我学习了一些基本的语法及API,这个就不记录了,主要记录一下我今天学习的几个钩子函数及对钩子函数的浅显总结:
1. beforeCreate: vue实例创建之前,methods,data,watch下的东西都还拿不到,即this不能使用。
2. created: vue实例创建之后,还未挂载(页面还未加载完全),不能操作dom,但是能使用this。
3. mounted: 挂载完毕,能够操作dom,此函数只能执行一次。
4. computed: 计算属性,默认取缓存,不支持异步,属性依赖的值发生变化的时候,才会触发。
5. watch:监测vue实例上的数据变动,不支持缓存,支持异步。