父级传参数给子级

father.vue

<template>
  <div>
    <p>我是父组件</p>
    <p>parent：{{ parentNum }}</p>
    <div>孩子↓</div>
    <my-child :deliverParentNum="parentNum"></my-child>

  </div>
</template>

<script>
import MyChild from './testchild.vue'
export default {
  components: { MyChild },
  data () {
    return {
      parentNum: 3,
    }
  },
}
</script>

child.vue

<template>
  <div>
      <p>我是子组件</p>
      <p>child:{{childNum}}</p>
      <p>父亲传过来的值：{{deliverParentNum}}</p>
  </div>
</template>

<script>
export default {
  data () {
    return {
      childNum: 4
    }
  },
  props: {
    deliverParentNum: Number
  }
}
</script>