vue3 参数传递 props

parent.vue

<template>
    <a-input v-model:value="InputValue"></a-input>
    <childVue :value="InputValue"/>
</template>
<script setup>
import {
      
       ref } from 'vue';
import childVue from './child.vue';

const InputValue = ref();



</script>
<style lang="less" scoped>
</style>

child.vue

<template>
    <span> {
   
   { value }} </span>
</template>
<script setup>
// setup 模式下的 传值写法
const props = defineProps({
      
      
    value: {
      
      
        // 可以传输多种数据类型
        type: [String, Number],
        // 是否必须传递
        required: true,
        // 默认值
        default() {
      
      
            return '空'
        },
        // 校验值合法性( 组件验证环节 )
        validator(value) {
      
      
            // The value must match one of these strings
            return ['success', 'warning', 'danger'].includes(value);
        }
    }
});

// setup 模式下的 传值简写 不进行判断
// const props = defineProps(['value']);

// setup 模式下的 传值简写2 值判断类型
// const props = defineProps({
      
      
//     value: String
// });




</script>
<style lang="less" scoped>
</style>