created与mounted的区别

今天咱们说一下vue的钩子函数created与mounted的区别，这个问题也是在学生面试时遇到的，当时学生这样回答：created就是在创建之前调用，mounted是挂载之后调用。我当时一听真是佩服呀，简直就是把英文翻译成了中文，这要是能面试成功，那个企业离倒闭也就不远了。
 

咱们说一下created与mounted真正的区别吧：

Created：在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。

Mounted：在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。

Created与Mounted的区别面试时的说法:

Created：在dom渲染之前调用，通常把初始化数据放在里面调用比如ajax数据等等。

Mounted：在dom渲染之后调用，比如咱们要获取document.getElementById，$(“#id”)，ref等等需要dom操作放在这里，比如初始化的轮番图效果swiper需要获取dom就放在这里使用。

那么在用户体验解决了什么问题呢？
 

比如在传统模式下开发，网速慢的时候会先展示默认的静态数据，等ajax请求完成后才显示动态数据，这样对于用户体验不是很好，现在vue的钩子函数created就解决了这个问题，咱们把ajax请求的数据放到created里面，这样页面在加载dom之前就先把数据获取出来然后在渲染到页面上就解决了之前显示默认静态数据的问题，提升用户体验。