一.什么是生命周期？ 通俗地说，这是从创建Vue的实例或组件到其消失的一系列过程。 虽然不太严密，但基本上可以理解。
通过一系列的实践，整理现在面临的所有问题，今天记录created和mounted的区别：
二. created和mounted的区别？ 官方图解为以下：
从图中看到两个节点。
在将模板渲染为html之前调用created: 这意味着通常先初始化特定属性值，然后再渲染到视图中。
在模板渲染为html之后调用mounted: 通常，在初始化页完成后，对html的dom节点执行必要的操作。
其实两者很容易理解，通常created的使用次数很多，但mounted通常像插件chart.js的使用： var CTX=document.getelementbyid (id )一样， 虽然在使用某些插件或使用组件时通常会涉及到这一步，但在写入组件时，您会发现created无法初始化chart，而是需要等待此html呈现完成。 mounted是最佳选择。 让我们看一个例子。
三.示例vue.component('demo1)、{
data :函数(
return {
name: '，
age: '，
city: ' '
}
(，
template 3360 ' ulli id=' name ' { name }/Li Li { { age }/Li Li { { city } }/Li/ul '，
created :函数(
this.name='gldbb '
this.age='12 '
this.city='杭州'
varx=document.getelementbyid (' name )//第一个命令行错误
console.log(x.innerhtml；
(，
mounted :函数(
varx=document.getelementbyid (' name )//从第二个命令台输出的结果
console.log(x.innerhtml；
}
)；
var vm=new Vue({ ((
el:'#example1'
() )
输出应类似于以下内容：
可以看出，任何一个都是通过created赋予初始值而成功绘制的。
但是同时看控制台台的话如下。
虽然出现第一个误报，但由于实际上找不到id，getelementbyid(id )由于以下原因找不到元素：
如果是created，则不会渲染视图中的html，因此，如果直接与html的dom节点进行交互，则会丢失相关元素
在mounted中，由于在该时刻已渲染了html，因此无法直接操作dom节点，因此输出了结果" gldbb "。
以上就是我自己总结的mounted和mounted的区别。 虽然写得很简陋，但请记录下来，加深印象。
转自：https://blog.csdn.net/xdn love me/article/details/78035065