Vue3学习--父传子&子传父

1.父传子

//父组件
//在父组件中引入子组件
<script>
import WelcomeItem from './components/WelcomeItem.vue' 

const count = ref(100)

</script>
<template>
<div class="father">
<h2>父组件</h2>
<!-- 1.绑定属性 -->
<WelcomeItem :count="count" message="father message"></WelcomeItem>
  </div>
</template>
//子组件
<script>
//2.defineProps接收数据
const props = defineProps({
message:'String'
count:Number
})
</script>
<template>
<div class="son">
<h3>子组件</h3>
<div>
  父组件传入数据--{{ message }}
</div>
</div>

</template>

你可能感兴趣的:(学习,javascript,开发语言)