vue2和vue3的5大不同点介绍

775 ℃

vue2vue3有哪些不同之处,下面web建站小编给大家简单介绍一下!

创建方式不同

vue2是一个构造函数,通过new创建一个Vue实例

new Vue({})

vue3是一个对象。通过对象Vue的createApp()方法创建一个vue实例

Vue.createApp({})

挂载容器的方式不同

//vue2
new Vue({el: '#app'})
new Vue({}).$mount('#app')

//vue3
Vue.createApp({}).mount('#app')

template模板不同

Vue2
<template>
//template下只能包含一个根节点。
<div>
//内容
</div>
</template>
Vue3
<template>
//template下可以包含多个根节点。
<div>//内容1</div>
<div>//内容2</div>
<div>//内容3</div>
</template>

data选项不同

//vue2
new Vue({
el:'#app',
  data(){
    return{}
  }
})

//vue3
Vue.createApp({
  data(){
    return {}
  }
})

生命周期

//左边是vue2 -> 右边是vue3
beforeCreate -> setup()
Created -> setup()
beforeMount -> onBeforeMount
mounted -> onMounted
beforeUpdate -> onBeforeUpdate
updated -> onUpdated
beforeDestroyed -> onBeforeUnmount
destroyed -> onUnmounted
activated -> onActivated
deactivated -> onDeactivated

vue2项目使用预渲染prerender-spa-plugin插件解决seo优化

Element UI中文官网Element Plus是一套基于Vue3.0的桌面端组件库

vue3项目如何正确引入新版高德地图(完整代码)

vue3如何解决store.state.count错误的取值

vue3相对于vue2有哪些新特性?

标签: vue2, vue3

上面是“vue2和vue3的5大不同点介绍”的全面内容,想了解更多关于 vuejs 内容,请继续关注web建站教程。

当前网址:https://m.ipkd.cn/webs_4418.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

wordpress调用全站热门文章(代码介绍)
网站PR值的几个误解
做单页面优化需要掌握哪些技巧?(自由列表)
react如何实现父组件调用子组件函数
在访问WordPress网站时,出现404页面,提示页面不存在