Vue2到Vue3，重学这5个常用的API

距离Vue3发布已经过去一年多时间了，从Vue2到Vue3是一个不小的升级，包括周边生态等。虽然目前大多数开发者们在使用的仍旧以Vue2为准，但Vue3显然是Vue开发者们未来必须面对的，而且前不久Vue官方也发布了Vue2.7.0，使得Vue2可以兼容Vue3的API，这让开发者可以在项目不升级Vue3的情况下依旧可以使用Vue3的开发方式，这为Vue2开发者学习Vue3提供了一个非常好的过渡途径。

Vue3之于Vue2最大的变化，当属composition API了，而除了引入composition API外，一些我们在Vue2上经常使用的东西到了Vue3时也发生了不小的变化，本文将介绍一些有Vue2到Vue3中几个比较重要且常用的知识点，欢迎感兴趣的同学阅读。

文中代码示例使用setup语法糖 + ts

v-model

支持多个v-model

在Vue3中，可以通过参数来达到一个组件支持多个v-model的能力。

// 父组件
<template><child v-model="name" v-model:email="email" /><p>姓名：{
  { name }}</p><p>邮箱：{
  { email }}</p>
</template>

<script lang="ts" setup>
import child from './child.vue'
import { ref } from 'vue'

const name = ref<string>('张三')
const email = ref<string>('[email protected]')
</script> 

// 子组件
<template><button @click="updateName">更新name</button><button @click="updateEmail">更新email</button>
</template>

<script lang="ts" setup> // 定义emit
const emits = defineEmits<{(e: 'upda