若依前后端分离ruoyi-vue3优化watch

在src/layout/components/AppMain.vue中

// 原 vue 2写法
// watch((route) => {
//   addIframe()
// })

控制台会报：

[Vue warn]: `watch(fn, options?)` signature has been moved to a separate API. Use `watchEffect(fn, options?)` instead. `watch` now only supports `watch(source, cb, options?) signature. 
  at <AppMain> 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouterView> 
  at <App>

可以进行修改:

import { watch, onMounted } from 'vue'
import { useRoute } from 'vue-router'

// vue 3 写法
watch(
  () => route, // 监听整个 route 对象
  // () => route.path, // 只监听 path 变化
  () => {
    addIframe()
  },
  { deep: true } // 深度监听，确保路由参数变化能触发
  // { deep: true, immediate: true } // 首次加载 + 变化时都触发
  // { immediate: true } // 首次加载时触发，需要立即检查初始值（如权限验证、默认状态处理）
)

其实有很多地方都使用了vue2的写法，可以参考进行修改。