脚本宝典收集整理的这篇文章主要介绍了vue中的生命周期,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
每一个组件或者实例都会经历一个完整的生命周期,总共分为三个阶段:初始化阶段、运行中阶段、销毁阶段
每个Vue实例在被创建之前都要经过一系列的初始化过程。例如需要设置数据监听、编译模板、挂载实例到DOM、数据变化时更新等。同时这个过程中也会运行一些叫做生命周期钩子的函数,给与用户机会在一些特定的场景下添加自己的代码
$.mount():若vue实例在实例化中没有el选项,则处于未挂载状态,可用$.mount手动地挂载一个未挂载的实例。
$.destory():完全销毁一个实例。清理它与其他实例的连接,解绑它的全部指令及事件监听器。
---
由官方提供的,基于webpack的脚手架工具:vue-cli
安装方法:
全局安装vue-cli:npm install --global vue-cli
创建一个基于webpack模板的新项目:vue init type(webpack) my-project(注:type是定义模板的类型)
安装依赖:cd my-priject
npm install
npm start(npm run dev)
模板类型:
simple:对应一个很简单的html文件
webpack:在配置的时候可以选择是否需要vue-router
注意的是,模板创建的时候会询问使用需要使用ESLINT来标准化我们的代码
脚手架中:src文件夹是开发目录,build文件夹负责打包文件,config文件夹是负责配置(内置服务器的端口、proxy代理)
static文件夹是静态目录,test文件夹是测试
src文件夹的main.js是入口文件,在里面创建了一个根实例,根实例的模板是组件App的模板,其他的组件都在根组件中进行嵌套实现。
每一个组件都是一个单文件组件,这种文件会被webpack利用vue-loader的工具进行编译
template部分负责写组件的模板内容,script中创建组件。style里写组件的样式
assets目录也是静态目录,在这个目标中的文件我们使用相对路径引入,而static目录中的文件使用绝对地址来引入
在style上添加scoped能使这个style里的样式只作用于当前的组件,不加scoped就是全局样式
习惯于在App.vue根组件的style里写全局样式,而每个组件的style最好都是局部的
以上是脚本宝典为你收集整理的vue中的生命周期全部内容,希望文章能够帮你解决vue中的生命周期所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。