vue3 props用法
案例父组件:index.vue<template><div><child1 :name="name" title="标题一"/></div></template><script>import { ref } from 'vue'// 导入子组件import child1from '../../components/child1
·
案例
父组件:index.vue
<template>
<div>
<child1 :name="name" title="标题一"/>
</div>
</template>
<script>
import { ref } from 'vue'
// 导入子组件
import child1 from '../../components/child1'
export default {
name: 'index4',
components: {
child1
},
setup(){
const name = ref('传入子组件的name');
return { name }
}
}
</script>
子组件 child1.vue
<template>
<div>
子组件 == {{name1}}, {{title1}}
</div>
</template>
<script>
import { reactive } from 'vue'
export default {
name: 'child1',
props: {
name: String,
title: String
},
setup(props){
const name1 = reactive(props.name)
const title1 = reactive(props.title)
return { name1, title1 };
}
}
</script>
更多推荐
已为社区贡献1条内容
所有评论(0)