24 组件传递数据

发布时间 2023-10-17 16:33:28作者: 被占用的小海海

组件之间相互传递数据,props
只能是,父级组件parent 传递数据 给 子级组件child
静态传递
动态传递:在静态的基础上,v-bind: {{ }} data()返回值,这些结合使用即可

<template>
    <!-- 文本绑定才需要 {{  }} ,属性绑定不需要 -->
<Child title="静态传递数据" :demo=" msg "/>  

</template>

<script>
import Child from './Child.vue';  // 1
export default{
    data() {
        return {
            msg: "动态传递数据"
        }
    },
    components: {   // 2
        Child,
    },
}
</script>
<template>
    <p>{{ title }}</p>
    <br>
    <p>{{ demo }}</p>
</template>

<script>
export default{
    props:["title","demo"]
}
</script>