Vue3+TypeScript情境下父子组件传值

父传子

父组件传递：

<MdEditor :content="传递内容"/>

子组件接受：

<template>
  <div id="MdEditor">
    <h2> 我是子组件</h2>
    传递: {{ props.content}}
  </div>
</template>


<script setup lang="ts">
interface Props {
  content: string;
}

const props = withDefaults(defineProps<Props>(), {
  content: "默认内容",
})

</script>

子传父

子组件:

const emit = defineEmits(["update:codeUpdate"]);
emit("update:codeUpdate", "传递给父组件");

父组件：

父组件接收：{{ content }}
<MdEditor @update:codeUpdate="getContent"/>



<script setup lang="ts">


const content = ref();
const getContent = (v: string) => {
  content.value = v;
}
</script>