如何在vuejs中传递带有道具的图片，而没有图片时所有内容都不会消失？

<!-- 父组件 -->
<template>
  <div>
    <child-component :imageProp="imageUrl"></child-component>
  </div>
</template>

<script>
export default {
  data() {
    return {
      imageUrl: 'path/to/image.jpg'
    }
  }
}
</script>

<!-- 子组件 -->
<template>
  <div>
    <img v-if="imageProp" :src="imageProp" alt="Image">
    <div v-else>
      <!-- 当没有图片时显示的内容 -->
    </div>
  </div>
</template>

<script>
export default {
  props: ['imageProp']
}
</script>