beforeCreate(创建前) 在数据观测和初始化事件还未开始
created(创建后) 完成数据观测,属性和方法的运算,初始化事件,$el属性还没有显示出来
beforeMount(载入前) 在挂载开始之前被调用,相关的render函数首次被调用。
实例已完成以下的配置:编译模板,把data里面的数据和模板生成html。注意此时还没有挂载html到页面上。
mounted(载入后) 挂载html到页面上。
实例已完成以下的配置:用上面编译好的html内容替换el属性指向的DOM对象。完成模板中的html渲染到html页面中。
beforeUpdate(更新前) 此状态数据已经改变,但dom尚未更新。
updated(更新后) 组件DOM已经更新完成。
beforeDestroy(销毁前) 在实例销毁之前调用。实例仍然完全可用。
destroyed(销毁后) 在实例销毁之后调用。调用后,所有的事件监听器会被移除,所有的子实例也会被销毁。
页面初始化渲染过程
父beforeCreate === 》 父created === 》 父beforeMount === 》子beforeCreate === 》子created=== 》子beforeMount === 》子mounted === 》父mounted
父组件先执行到beforeMounted,随后执行子组件到mounted,最后再反过来执行你组件的mounted,开始渲染。
子组件更新过程
父beforeUpdate ===》子beforeUpdate ===》子updated ===》父updated
注意:子组件的更新,首先是父组件的beforeUpdate,其次才是子组件的更新,最后是你组件的updated.(子组件的任何更新,都是从你组件的beforeUpdate开始的)
父组件更新过程
父beforeUpdate ===》 父updated
销毁过程
父beforeDestroy ===》 子beforeDestroy ===》 子destroyed ===》 父destroyed
3.1、React和Vue有许多相似之处,它们都有:
3.2、 性能:
3.3、生态圈
Vue: Vue+vue-router+vuex+iVew/element-ui
React: React+React-router+Redux+ant-design
3.4、什么时候选择Vue/React
如果你喜欢用(或希望能够用)模板搭建应用,请使用Vue
如果你喜欢简单易上手的东西,请使用Vue
如果你的应用需要尽可能的小和快,请使用Vue
如果你计划构建一个大型应用程序,请使用React
如果你想要一个同时适用于Web端和原生App的框架,请选择React
如果你想要最大的生态圈,请使用React
作者:Aniugel
链接:https://www.jianshu.com/p/4db4b191de06
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。