vuejs项目开发如何利用Props实现父子组件传参

  

vuejs项目开发中如何利用Props实现父子组件传参,下面编程教程网小编给大家详细介绍一下实现代码!

父组件代码

<template>
  <!-- 使用子组件 -->
  <Child :msg="message" />
</template>
 
<script setup>
import Child from './components/Child.vue' // 引入子组件
 
let message = '你好,朋友!'
</script>

子组件代码

<template>
  <div>
    {{ msg }}
  </div>
</template>
 
<script setup>
 
const props = defineProps({
  msg: {
    type: String,
    default: ''
  }
})
 
console.log(props.msg)
 
</script>
以上是编程学习网小编为您介绍的“vuejs项目开发如何利用Props实现父子组件传参”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。

相关文章