Vue3+TypeScript父子组件传值

将数据从父组件传递到子组件（Props）

子组件

我们先来创建一个子组件

<template>
  <div class="child">
    <h3>{{title}}</h3>
    <p>{{content}}</p>
  </div>
</template>
<script setup lang="ts">
  //从父级接收数据，定义接口
  interface Props {
    title: string;
    content: string
  }

  //defineProps() 加上定义的接口名称
 // defineProps<Props>();
const propsData = defineProps<Props>();
  console.log('propsData',propsData.title,pro

付费内容，0.11币解锁全文 >>

Vue3 小问答

Vue3 小问答，每天一个问答，你来问我来答

收录 16 篇文章

订阅专栏可永久解锁本文 >>

TypeScriptvue3父子组件-动态渲染

Hedy

大家好！我是一位前端开发工程师，拥有6年以上的前端开发经验。我熟练掌握HTML、CSS、JavaScript等语言，能够灵活运用各种前端框架，如Vue、React、Uniapp、Flutter等。我注重理论与实践相结合，能够为学员提供丰富的案例和实践项目，并以生动、易懂的语言为学员讲解前端开发的核心知识和技能。我不仅注重传授技能，更关注学员的职业发展，希望通过我的教学，帮助学员成为一名优秀的前端开发工程师。