想知道Vue3与Vue2的区别?五千字教程助你快速上手Vue3!

从Vue3发布以来,我就一直对其非常感兴趣,就一直想着将其投入公司的生产中,但是开始考虑到很多不确定性就暂时对一些很小的功能进行一些尝试;慢慢的发现组合式Api的形式非常适合开发(个人感觉),尤其是Vue3.2推出了setup语法糖后直呼真香。后面公司的新项目几乎全部采用了Vue3了。使用Vue3开发也将近大半年了,所以写了这篇文章对Vue2和Vue3做了一个对比总结,一是为了对这段时间使用Vue3开发做些记录,二是为了帮助更多的小伙伴更快的上手Vue3。

本篇文章主要采用选项式Api,组合式Api,setup语法糖实现它们直接的差异

选项式Api与组合式Api

首先实现一个同样的逻辑(点击切换页面数据)看一下它们直接的区别

选项式Api

{{msg}}

export default {

data(){

return {

msg:hello world

}

},

methods:{

changeMsg(){

this.msg = hello juejin

}

}

}

组合式Api

{{msg}}

import { ref,defineComponent } from "vue";

export default defineComponent({

setup() {

const msg = ref(hello world)

const changeMsg = ()=

THE END
Copyright © 2024 亿华云