vue中关于父组件传值给子组件时出现undefined现象

小白学习时Vue时遇到了父组件给子组件传值时，

父组件

<Details :carId="carId1" :title="title" :patient="patient" :reason="reason" :hostNumber="hostNumber" ></Details>    

子组件

`javascript
props:{

    carId:{
      
    },
    title:{
       type:String,
      default: '.......',
    }
    ,

    patient:{
      type:String,
      default: '.......',
    },
    reason:{
      type:String,
      default: '.......',
    },

    hostNumber:{
      type:Array,
      
    },
  },
`` mounted() {
    console.log(this.hostNumber)

    
     
  },

显示这个值为undfined
即使在watch中监听这个变量发现并不能监听到这个值的变化
感觉是子组件渲染的过快，当mounted时父组件还没有给这个变量赋值就传过来完成渲染了。
所以我们得给子组件加点限制让他不要这么快完成渲染，采用v-if

<Details :carId="carId1" :title="title" :patient="patient" :reason="reason" :hostNumber="hostNumber" v-if="hostNumber.length==2&&carId1!=null"></Details>    

加的这个限制就是在父组件没有给hostNumber这个变量赋完值之前不准子组件渲染。
感觉v-if比watch深度监听开启立即监听要靠谱所以还是用v-if好一点