Avoid mutating a prop directly since the value will be overwritten whenever the parent ...
错误:[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: "grants" (found in component )
出错原因:
父组件:
子组件:
使用了element UI的transfer穿梭框组件,绑定了已授权的角色id,从父组件传导子组件的prop中
此时如果操作赋权,将会改变绑定的grants属性,引起以上报错信息。子组件中更改绑定的prop值最好使用计算属性computed解决。
解决方式:
computed: {grants_: {get() {return this.grants;},set(val) {//grants_改变由父组件控制this.$emit("on-change-grant", val);}}}
将绑定的grants改为绑定计算属性值grants_,此时的set方法不能写 this.grants = val,这样和直接绑定prop中的grants有什么两样呢?所以,最好要将此时的grants_改变交给父组件控制,通过父组件来改变prop的grants值。完美解决这个错误。
父组件中修改:
methods里面添加:
表达能力有限,第一次遇到这个问题所以将它写在博客中,将错误原因和解决方式截图显示出来方便大家理解,有什么不对的地方大家可以评论我一起学习。
Avoid mutating a prop directly since the value will be overwritten whenever the parent ...相关推荐
- Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-
原因: 子组件改了父组件的值 避免修改父组件传过来的值 注意: 如果value是obj,需要进行深拷贝. 可以参考: https://blog.csdn.net/u013948858/article/ ...
- vue使用prop通信出错:Avoid mutating a prop directly since the value will be overwritten whenever the parent
使用props进行父子组件通信时产生错误:Avoid mutating a prop directly since the value will be overwritten whenever the ...
- uni-app:Avoid mutating a prop directly since the value will be overwritten whenever the parent
Avoid mutating a prop directly since the value will be overwritten whenever the parent component re- ...
- Avoid mutating a prop directly since the value will be overwritten whenever the parent component...
Avoid mutating a prop directly since the value will be overwritten whenever the parent component re- ...
- [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever...
报错 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the paren ...
- Avoid mutating a prop directly since the value will be overwritten whenever
Avoid mutating a prop directly since the value will be overwritten whenever the parent component re- ...
- VUE报错:Avoid mutating a prop directly since the value will be overwwritten whenever the parent及解决方案
VUE报错: [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the p ...
- 报错信息:Avoid mutating a prop directly since the value will be overwritten
报错信息:Avoid mutating a prop directly since the value will be overwritten whenever the parent componen ...
- avoid mutating a prop directly since the value will be overwritten whenever完美解决
在vue父组件传递数据给子组件时候,通过双向绑定给属性赋值时候,报错如下:Avoid mutating a prop directly since the value will be overwrit ...
最新文章
- Ubuntu Server 更改hostname
- SQL CROSS JOIN
- 005_JDK的Date类对Comparable接口的实现
- 登录抓包逆向分析学习笔记
- STM32 SPI难点浅析
- getopt()简介
- c++类对象的创建方式
- 使用 Pandas 分析 Apache 日志
- python开发gui实战_python实战GUI界面+mysql
- Java设计模式学习总结(12)——结构型模式之外观模式
- centos7 update network time
- 在 Windows下使用 fastText
- C# 使用微信扫码登录网页
- localhost:3000 拒绝访问解决办法
- Hardware ---- 输出阻抗
- python从1加到100的其中两种方式
- Binarized Neural Network : BNN二值神经网络代码实例
- LeetCode(626):换座位 Exchange Seats(SQL)
- 【贪心策略】区间选点问题
- 百度SRE面经-为三面攒人品