vue中父组件向子组件传参

项目中经常用到组件与组件的传参以及父组件跟子组件的传参，还有子组件跟父组件的传参，下面大概说下父组件向子组件传参的整个过程，如果有不对的地方，望指正。

在父组件中：

<template>
    <div>
      <child :table="details"></child>
    </div>
</template>

<script>
  import Child from './child'
    export default {
        name: "father",
        components:{Child},
        data(){
          return{
            details:{
              status:10,
              message:"我是父组件传递过来的值"
            }
          }
        }
    }
</script>

<style scoped>

</style>

子组件：

<template>
    <div>
      <button>按钮</button>
      <p>{{table.status}}</p>
      <p>{{table.message}}</p>
    </div>
</template>

<script>
    export default {
        name: "child",
        props:{
          table:{
            type:Object
          }
        }
    }
</script>

<style scoped>

</style>

在这里，父组件向子组件传递的是一个对象，而我们利用v-bind动态绑定了table，以一个对象的形式传递过去，在子组件中用props进行接受，并且接受的名称，也就是上面所述的table，跟父组件动态绑定的名称一致，里面的type，是传递的类型，如果不符合，会报错，也可以向下面这样。

<template>
    <div>
      <button>按钮</button>
      <p>{{table.status}}</p>
      <p>{{table.message}}</p>
    </div>
</template>

<script>
    export default {
        name: "child",
        props:["table"]
    }
</script>

<style scoped>

</style>

这种不需要传递的类型，但是需要注意的是props接受的是数组，如果是对象的话，接受的是对象，大家需要注意。