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;
  }>();
相关推荐
紫_龙8 分钟前
最新版vue3+TypeScript开发入门到实战教程之路由详解三
前端·javascript·typescript
-SOLO-12 分钟前
使用Cursor操控正在打开的Chrome
前端·chrome
chiwei_hua12 分钟前
如何在 Blazor Web 前端中使用 C# 进行数据交互?
前端·c#·交互
jacklood1 小时前
使用STM32的迪文屏控制使用参考方式
前端·javascript·stm32
KevinCyao1 小时前
Go短信营销接口示例代码:Golang高并发调用营销短信接口的实现方案与代码分享
android·前端·网络·golang·前端框架
Moyo2031 小时前
前端 -- react快速入门
前端·react.js·前端框架
whuhewei1 小时前
在React中实现CSS动画的回放
前端·css·react.js
北海军1 小时前
render el-select下拉框
前端·javascript·vue.js
We་ct2 小时前
LeetCode 4. 寻找两个正序数组的中位数:二分优化思路详解
前端·数据结构·算法·leetcode·typescript·二分
H@Z*rTE|i2 小时前
vue首屏加载优化
前端·javascript·vue.js