Vue3-Setup语法糖

导入组件

// 在script中导入即可直接在template中使用
import Comp from './comp.vue'

自定义组件的双向绑定

单v-model

在组件上使用v-model，组件内部会自动在props中声明一个modelValue，emit中声明一个update:modelValue 用input举例，在标签内使用@input="emit('update:modelValue', $event.target.value)"

多v-model

例如在组件上使用v-model:value，和单v-model一样，只不过modelValue改成value

Vue3-Setup组件通讯

以下均为setup语法糖写法

父传子

<!-- 自定义组件 -->
<Component data="123123">

<!-- script -->
<script lang="ts" setup>
    defineProps({
        data: {
            type: String,
        },
    })
</script>