vue 父传子props

大家好，欢迎来到IT知识分享网。

父传子(通过prop实现通信)

1、静态传递
子组件通过props选项来声明一个自定义的属性，然后父组件就可以在嵌套标签的时候，通过这个属性往子组件传递数据。

通过v-bind绑定props的自定义的属性，可以是一个表达式、布尔值、对象等等任何类型的值。

父组件

<template>
 <div>
 <h1>我是父组件！</h1> 
 <child v-bind:message="msg"></child>
 </div>
</template> 
<script> import Child from '../components/child.vue' export default { 
     //子组件引用 components: { 
     Child }, data() { 
     return { 
     msg: '我是子组件三！'+ Math.random() } } } </script>

子组件

<template>
 <h3>{
  
  {message——使用}}</h3>
</template>
<script> export default { 
     props: ['message']——接收 } </script>