122828837@qq.com
122828837@qq.com
  • 发布:2019-05-30 12:02
  • 更新:2020-05-19 20:05
  • 阅读:8212

Avoid mutating a prop 组件传值报错

分类:uni-app

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: "value"

父组件中更改子组件中的属性后,就爆出来这个东西。

我的子组件根本没有去改变父主键传过来的这个属性

这个是bug吗

2019-05-30 12:02 负责人:无 分享
已邀请:
1213792401@qq.com

1213792401@qq.com

我也遇到这种情况,关键我也没改,就只用来展示,还解引用了,而且微信小程序不报错支付宝小程序报这个错,虽然不影响使用,但是看着是真的难受这些报错

liuxy

liuxy - 90后

你好请问下问题解决了吗?我也遇到这个问题

  • 17802076364@163.com

    data(){return{}} 在return中添加一个新的属性,用于接收传过来的属性,然后操作的时候用这个新的属性操作,不要用传过来的属性。

    export default {

    name: 'app-header',

    props:{

    title:{

    type:String

    }

    },

    data () {

    return {

    title1:'this is header',

    newTitle:this.title

    }

    },

    methods:{

    changetitle:function(){

    this.newTitle="我是新值"

    }

    }


    }

    2019-08-20 20:16

  • 17802076364@163.com

    单向数据流


    所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定:父级 prop 的更新会向下流动到子组件中,但是反过来则不行。这样会防止从子组件意外改变父级组件的状态,从而导致你的应用的数据流向难以理解。

    额外的,每次父级组件发生更新时,子组件中所有的 prop 都将会刷新为最新的值。这意味着你不应该在一个子组件内部改变 prop。如果你这样做了,Vue 会在浏览器的控制台中发出警告。

    2019-08-20 20:22

黑色领带结

黑色领带结

这个报是因为在子组件改变了接收到的值。---------子组件接收后,赋值给一个新变量,然后再使用赋值后的变量(this.currentIndex) 就行了

wsi18n

wsi18n

看着warn难受的可以这样弄下:

Vue.config.warnHandler = function (msg) {  
  if (!msg.includes('Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders.')) { // uniApp bug: https://ask.dcloud.net.cn/question/71966  
    return console.warn && console.warn(msg)  
  }  
}
ZGH0709

ZGH0709

上传个 dmeo 看一下。

ilijiayin

ilijiayin

1.9.11以上版本是出现这样的问题,请问怎么解决?

[ERROR] : [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: "values"
40634156@qq.com

40634156@qq.com

原先1.9.4没这个提示,升级到2.0.0就有了

122828837@qq.com

122828837@qq.com (作者) - 一句话,干,遇见问题就干他,干不了他,找办法

官方已经确定是bug,后期应该会修复吧。
应该是个误报,对正常使用没有影响

  • tangi1910@163.com

    请问一下这个bug修复了吗?哪里可以看到

    2019-07-11 16:08

程咬金3斧头

程咬金3斧头

这个应该是因为在组件内部的方法中,改变了prop 中的变量引起的

1951844956@qq.com

1951844956@qq.com

我搞的都快哭了,,,居然是bug

841115691@qq.com

841115691@qq.com

我也遇到这个问题了,还以为我的错。。。

  • tangi1910@163.com

    bug已经修复了,最新版本 + 修复 自定义组件模式下,未直接修改 props 仍报 [Vue warn]: Avoid mutating a prop directly… 异常信息的Bug 详情

    2019-07-15 16:50

18334794858@163.com

18334794858@163.com - 这总没错吧

xinazai
现在还
报错么

dengyi@dengyi.pro

dengyi@dengyi.pro

这个问题依旧存在啊

133490326@qq.com

133490326@qq.com

官方解决一下这个BUG

https://ask.dcloud.net.cn/question/75006

zhengzhiwei@corefac.com

zhengzhiwei@corefac.com

到目前为止还有BUG

543423044@qq.com

543423044@qq.com

你们的还爆这个错误吗?大佬们,我的也是这个错误

773561801@qq.com

773561801@qq.com

# 2个方法

第一个 :

// 父组件  
<dialog-apply :visible.sync="dialogApplyVisible" />  

// 子组件  
<el-dialog  
      :visible.sync="visible"  
      title="申请"  
      :before-close="onClose"  
>  

onClose() {  
  this.$emit('update:visible', false)  
}

第二个 :

// 父组件  
<dialog-apply :visible.sync="dialogApplyVisible" @close='dialogApplyVisible = false' />  

// 子组件  
<el-dialog  
      :visible.sync="visible"  
      title="申请"  
      :before-close="onClose"  
>  

onClose() {  
  this.$emit('close')  
}

这2个方法 ,:before-close 是关键 ;

要回复问题请先登录注册