vue生命周期共有几个阶段（【前端】重学vue，vue生命周期基础知识了解一下）
写在前面
上一篇有写到vue的node环境的安装 ，具体的地址node安装 ，可点过去看下安装步骤 ，目前去node官网下载默认是最新版本的18.15.0版本 。这个版本可能有些高 ，可以选择跟目前项目匹配的版本下载安装即可 。
如果项目启动遇到项目启动不成功 ，如下图
这样肯定是node版本的问题 ，解决方案如下
node.js版本问题需要输入命名来解决 ，或者是用node的nvm版本管理器调整相应的版本 。
命令方式：
在编辑器终端命令行输入如下命令 。
命令行输入：$env:NODE_OPTIONS=“–openssl-legacy-provider ”
正常解决：
1.npm常用命令
NPM是Network Power Manager缩写 ，是网络管理电源控制器 。安装了node.js之后就可以使用npm命令操作了 ，因为npm是node.js包管理器 。它可以让开发者下载 、安装 、上传以及管理已经安装的包 。
比如一下命令操作：
npm install 安装模块 npm uninstall 卸载模块 npm update 更新模块 npm outdated 检查模块是否已经过时 npm ls 查看安装的模块 npm init 在项目中引导创建一个package.json文件 npm help 查看某条命令的详细帮助 npm root 查看包的安装路径 npm config 管理npm的配置路径 npm cache 管理模块的缓存 npm start 启动模块 npm stop 停止模块 npm restart 重新启动模块 npm test 测试模块 npm version 查看模块版本 npm view 查看模块的注册信息 npm publish 发布模块 npm access 在发布的包上设置访问级别 npm package.json的语法 。cnpm介绍
已经知道了npm是什么了 ，那cnpm是什么呢？ cnpm的官方介绍是:cnpm是一个完整npmjs.org镜像 ，是淘宝定制的cnpm(gzip 压缩支持) 命令行工具代替默认的npm: (3)如果因为网络原因无法使用npm下载,那cnpm这个就派上用场了 ，看到这 ，肯定知道了它的用途了吧 。
下面就是cnpm的安装命令：
npm install -g cnpm --registry=https://registry.npm.taobao.org
以后有下载慢的包 ，可以使用cnpm命令进行下载 ，毕竟是国内的下载速度肯定能提升很多 。
vue生命周期
项目前端如果使用Vue实现 ，必须要知道vue的生命周期 ，生命周期就是Vue实例从创建到销毁的过程 ，
vue实例有一个完整的生命周期 ，即从开始创建 、初始化数据 、编译模板 、挂载Dom 、渲染→更新→渲染 、卸载等一系列过程 。
上图这个是v2.0版本的生命周期钩子 ，那vue3.0有哪些变化呢？setup取代beforeCreate和created
setup中的函数执行相当于在选项api中的beforeCreate和created中执行
组合式api的生命周期需引入使用
eforeMount -> onBeforeMount ，在挂载前被调用
mounted -> onMounted ，挂载完成后调用
beforeUpdate -> onBeforeUpdate ，数据更新时调用 ，发生在虚拟 DOM 打补丁之前 。此时内存中的数据已经被修改 ，但还没有更新到页面上
updated -> onUpdated ，数据更新后调用 ，此时内存数据已经修改 ，页面数据也已经更新
beforeUnmount -> onBeforeUnmount ，组件卸载前调用
unmounted -> onUnmounted ，卸载组件实例后调用 。
errorCaptured -> onErrorCaptured ，每当事件处理程序或生命周期钩子抛出错误时调用
renderTracked -> onRenderTracked ，状态跟踪 ，vue3新引入的钩子函数 ，只有在开发环境有用 ，用于跟踪所有响应式变量和方法 ，一旦页面有update ，就会跟踪他们并返回一个event对象
renderTriggered -> onRenderTriggered ，状态触发 ，同样是vue3新引入的钩子函数 ，只有在开发环境有效 ，与onRenderTracked的效果类似 ，但不会跟踪所有的响应式变量方法 ，只会定点追踪发生改变的数据 ，同样返回一个event对象
activated -> onActivated ，与keep-alive一起使用 ，当keep-alive包裹的组件激活时调用
deactivated -> onDeactivated ，与keep-alive一起使用 ，当keep-alive包裹的组件停用时调用
写到最后
写到这里 ，是不是对vue生命周期的知识点又了解了一些 ，了解了更多的知识请关注公众号 。
创心域SEO版权声明：以上内容作者已申请原创保护，未经允许不得转载，侵权必究！授权事宜、对本内容有异议或投诉，敬请联系网站管理员，我们将尽快回复您，谢谢合作！