vue子组件接收props并渲染失败

原因：父组件还没有向后端请求到数据并传递给子组件，但子组件已经开始渲染数据

解决方法：watch 监控 props 的变化。当 imageList 数据更新时，子组件可以执行特定操作或触发特定状态

父组件

<ImageView :image-list="product.pictureList"/>

子组件

const isload = ref(true)

//props适配图片列表
const props = defineProps({
    imageList: {
      type: Array,
      default: () => [],
    }
})

//监控变量
watch(
  () => props.imageList,
  (newImageList) => {
    if(newImageList.length > 0){
      isload.value = false
    }
  },
)

子组件html:

<div class="goods-image" v-if="!isload">