Vue3详细介绍

Vue 3 是 Vue.js 框架的下一个主要版本，它引入了许多新特性和改进。

新特性：

1. Composition API: 使用 setup 函数来组合逻辑，而不是使用 mixins 和 extends。
2. Fragment, Teleport, Suspense: 提供了新的基础组件来处理片段、传送和异步渲染。
3. 增强的TS支持: 更好地支持TypeScript，提供更好的类型推断和自动完成。
4. 重构的虚拟DOM: 更快的渲染速度和更小的包体积。
5. 新的生命周期钩子: 更简洁的生命周期钩子，如 onMounted 替代 mounted。
6. 其他改进：如更新优化、服务端渲染改善、工具改进等。

安装Vue 3：

使用npm或yarn安装Vue 3。

npm install vue@next
# or
yarn add vue@next

创建Vue 3项目：

使用Vue CLI创建Vue 3项目。

npm install -g @vue/cli
vue create my-vue3-app
# 选择 Vue 3 版本

简单示例代码：

<template>
  <div>{{ message }}</div>
</template>
 
<script>
import { defineComponent, ref } from 'vue';
 
export default defineComponent({
  setup() {
    const message = ref('Hello Vue 3!');
    return { message };
  }
});
</script>

这个简单的示例展示了Vue 3中的Composition API的基本使用，通过ref函数创建一个响应式的数据。