今天在做Vue的时候,子组件关闭的时候,报如下错误

报错:vue.esm.js?65d7:610 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "isVisible"

问题解决:

父组件里面调用子组件的代码

<NoteBookLimitFlow :isVisible="isShowFlowSearch"></NoteBookLimitFlow>

  

isVisible用来判断是否显示子组件

子组件里面的代码

<el-dialog title="XXXX"
:visible.sync="IsShowPage"
@close="closeForm()">
</el-dialog> watch: {
isVisible(val) {
this.IsShowPage = val;//新增isVisible的watch,监听变更并同步到IsShowPage上
}
}, data() {
return {
//定义一个IsShowPage来接收传递过来的值 
IsShowPage: this.isVisible,
}
}

  

报错:[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the paren的更多相关文章

  1. vue报错 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's

    [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent c ...

  2. Vue 报错[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders

    场景:父组件向子组件传递数据,子组件去试图改变父组件数据的时候. 解决:子组件通过事件向父组件传递信息,让父组件来完成数据的更改. 比如:我的父组件是普通页面,子组件是弹窗的登录界面,父组件传递的数据 ...

  3. Vue报错之"[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead......"

    一.报错截图 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the p ...

  4. [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being

    [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent c ...

  5. 报错:[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop bei

    项目中遇到父组件传值 activeIndex <Tabs :tabs="tabs" :activeIndex="activeIndex" >< ...

  6. Avoid mutating a prop directly since the value will be overwritten whenever the parent component re

    子组件修改父组件的值踩坑 Vue1.0升级至2.0之后,直接在子组件修改父组件的值是会报错的 目的是为了阻止子组件影响父组件的数据. 我们都知道在vue中,父组件传入子组件的变量是存放在props属性 ...

  7. Vue avoid mutating a prop directly since the value will be overwritten

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. (复习)父子组件传值使用v-modal双向绑定,报错Avoid mutating a prop directly解决方案

    报错:Avoid mutating a prop directly since the value will be overwritten whenever the parent component. ...

  9. Vue 错误:Avoid mutating a prop directly

    Avoid mutating a prop directly since the value will be overwritten whenever the parent component re- ...

随机推荐

  1. PHP ftp_login() 函数

    定义和用法 ftp_login() 函数登录 FTP 服务器. 如果成功,该函数返回 TRUE.如果失败,则返回 FALSE 和一个警告. 语法 ftp_login(ftp_connection,us ...

  2. Android中如何搭建一个WebServer

    今天终于把老大交代的任务搞完了,感觉收获挺多的,所以就写一篇来记录一下吧,首先还是来看一下,老大们的需求 需求: 希望移动端的用户标识(IMEI)和HTML页面的用户标识(Cookie)连接起来,其中 ...

  3. 转-C++之手写strcpy

    转自:strcpy函数的实现 知strcpy函数的原型是: char *strcpy(char *dst, const char *src); 实现strcpy函数 解释为什么要返回char * 假如 ...

  4. STL unique

    1: template <class ForwardIterator> 2: ForwardIterator unique (ForwardIterator first, ForwardI ...

  5. 前端(二十二)—— vue组件:局部组件、全局组件、父组件数据传到子组件、子组件数据传到父组件、父子组件实现todoList

    Vue组件 一.组件介绍 每一个组件都是一个vue实例 每个组件均具有自身的模板template,根组件的模板就是挂载点,根组件也可以显式书写模板,会替换掉挂载点 每个组件模板只能拥有一个根标签 子组 ...

  6. 如何调用DLL中的导出类

    之前在网上一直查不到关于把类打包成dll文件的程序,今天自己写了个测试程序,供大家参考 一.生成类的dll文件 1.我是在vs2008上测试的,建立工程,在选择建立何种类型的工程的时候,勾上appli ...

  7. 关于Visual Leak Detector的配置与使用 (测试vector 引起的内存泄漏问题)

    之前在做一个音频特征提取的批量处理程序,老是出现内存泄露问题,用Visual Leak Detector(VLD)工具做了下检测,检测出了一些问题,解决后还是会有问题.之后继续排查,因为我的代码中,大 ...

  8. python实现马赛克拼图!

    python实现马赛克拼图 直接上代码! 代码如下: #!/usr/local/bin/python3#  --*-- coding:utf8 --*-- import getoptimport sy ...

  9. bootstrap-自带插件(完成的小功能)

    模态框 务必将模态框的HTML代码放在文档的最高层级内(也就是说,尽量作为 body 标签的直接子元素),以避免其他组件影响模态框的展现和/或功能. <!-- 触发模态框的按钮 --> & ...

  10. 解决MSF更新证书错误

    如下图所示提示签名无效下载失败,导致更新不了msf 解决办法如下: echo 'deb http://apt.metasploit.com/ lucid main' > /etc/apt/sou ...