观察 Vue 3 中嵌套属性的变化
P粉060112396
P粉060112396 2024-03-31 18:31:30
0
1
445

我创建了一个带有反应性 API 的简单状态管理

我的商店文件如下所示:

import { reactive, watch  } from "vue";

const state = reactive({
   form : {
    service_id : null
   }
})

 watch('state.form.service_id', (newVal, oldVal) => {
     console.log('service changed');
 }, { deep: true });
 

export default {
  state, 
}

我试图观察 state.form.service_id 中的变化,但出现以下错误:

[Vue warn]: 无效的监视源:state.form.service_id 监视源只能是 getter/effect 函数、ref、反应对象或这些类型的数组

如果我用以下代码替换手表代码,那么它就可以工作。

watch('state.form', (newVal, oldVal) => {
     console.log('form changed');
 }, { deep: true });

但我需要注意 state.form.service_id 的变化。有什么解决办法吗?

P粉060112396
P粉060112396

全部回复(1)
P粉129275658

尝试使用 getter 函数而不是属性路径:

 watch(()=>state.form.service_id, (newVal, oldVal) => {
     console.log('service changed');
 }, { deep: true });
 

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板