解决vue3子组件watch无法监听到父组件的prop参数变化

更新于 2023-09-06 14:40 393
专栏: 前端文章 标签: vue

开发中发现在子孙组件无法监听到祖父组件的prop数据,在网上找到了解决方案

将watch方法中设置immediate: true

  1. <script lang="ts" setup>
  2. import { ref, watch } from 'vue'
  3. watch(() => props.aiAppletId, (newVal: number | undefined) => {
  4. console.log('nawVal', newVal)
  5. if (newVal)
  6. getInfoApi(newVal)
  7. else
  8. promptAppletInfo.value = { ...defaultPromptAppletInfo }
  9. }, { immediate: true }) // immediate: true 非常重要
  10. </script>