`vue3`简介

Vue2 已于 2023 年 12 月 31 停止维护。详见 Vue 2 终止支持 (EOL)。
想从Vue2升级？请参考迁移指南。

Vue是一款用于构建用户界面的Javascript框架。它基于标准HTML CSS 和Javascript构建，并提供了一套声明式、组件化的编程模型。

Vue3.0 代号 One Piece于 2020 年 9 月 19 日凌晨正式发布，此次更新为用户提供了全新的composition-api以及更小的包大小，和更好的Typescript支持。

Vue3.x版本在性能上有巨大提升，写法上也有很大的差异（也兼容Vue2的Options选项式写法）

vue

<template>
	<div>vue2</div>
	<div>{{ msg }}</div>
</template>

<script>
export default {
	data() {
		return {
			msg: "hello vue2",
		};
	},
	components: {},
	computed: {},
	methods: {
		//TODO
	},
};
</script>

以上是以前Vue2的选项时写法，接下来看看Vue3的新语法。

vue

<template>
	<div>Vue3</div>
	<div>{{ msg }}</div>
</template>

<script>
import { ref } from "vue";
export default {
	setup() {
		const msg = ref("hello vue3");
		return {
			msg,
		};
	},
};
</script>

Vue3还可以使用setup语法糖

vue

<template>
	<div>Vue3</div>
	<div>{{ msg }}</div>
</template>

<script setup>
import { ref } from "vue";
const msg = ref("hello vue3");
</script>

vue3简介 ​

`vue3`简介