Unexpected mutation of “xxxx“ prop

原因

是因为子级修改了父级的数据,所以eslint执行的时候报了这个错

修复方式 1

如果是弹窗等组件,可以根据功能进行修改,比如我这块用的 element ui 的 dialog,便可以改成这样

使用 model-value 代替

修复方式 2

新建子组件变量,然后使用watch进行,父级子级,变量数据同步

修复方式 3

如果您使用的是 input 组件,需要加个 @update 方法, 就可以了

js 复制代码
 <a-modal :visible="visible"  @update:visible="updateVisible" >
 
  const updateVisible = (e) => {
    emits('update:visible', e);
  };
  
  const emits = defineEmits<{
    (e: 'handleOk', val: any): void;
    (e: 'update:visible', val): void;
  }>();
相关推荐
m0_7482299915 分钟前
Vue2 vs Vue3:核心差异全解析
前端·javascript·vue.js
C澒36 分钟前
前端监控系统的最佳实践
前端·安全·运维开发
xiaoxue..39 分钟前
React 手写实现的 KeepAlive 组件
前端·javascript·react.js·面试
hhy_smile1 小时前
Class in Python
java·前端·python
小邓吖1 小时前
自己做了一个工具网站
前端·分布式·后端·中间件·架构·golang
南风知我意9571 小时前
【前端面试2】基础面试(杂项)
前端·面试·职场和发展
LJianK12 小时前
BUG: Uncaught Error: [DecimalError] Invalid argument: .0
前端
No Silver Bullet2 小时前
Nginx 内存不足对Web 应用的影响分析
运维·前端·nginx
一起养小猫2 小时前
Flutter for OpenHarmony 实战 表单处理与验证完整指南
android·开发语言·前端·javascript·flutter·harmonyos
weixin_395448912 小时前
main.c_cursor_0130
前端·网络·算法