uni-app 父子组件使用props传值,支付宝小程序中出现错误

iyr7buue  于 2022-12-31  发布在  uni-app
关注(0)|答案(5)|浏览(363)

问题描述
父子组件使用props传值,支付宝小程序中出现错误
[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: "loadstate"

found in

---> /components/uni-load-more/uni-load-more

我并没有在子组件中直接改动props参数,并且在微信小程序中运行正常
复现步骤
[复现问题的步骤]
父组件

子组件

预期结果
不会出现错误

实际结果

系统信息:

  • 发行平台: 支付宝小程序
  • 操作系统 macos 10.15.3
  • HBuilderX版本 2.6.1.20200226
  • 运行:支付宝小程序开发工具1.5.7

补充信息
我在子组件并没有直接改动props中的参数,data中用其他字段进行备份也不行,如果父组件传人的是一个静态字符串就不会报错。并且运行到h5、微信小程序中并没有报错

niwlg2el

niwlg2el1#

同样发现这个问题

nwwlzxa7

nwwlzxa72#

都没有人回答么?

kzmpq1sx

kzmpq1sx3#

  1. 除了报错,功能上是否出现异常?
  2. 报错的属性传入的数据是什么类型的?
gt0wga4j

gt0wga4j4#

在淘宝小程序里运行,重现步骤:在onLoad里改变foo的值会触发这个bug,但如果是在mounted里放到一个延迟函数了有一定几率不会触发。prop与类型无关,功能上看起来是正常的。

// Parent.vue
<template>
    <view>
        <Child :foo="foo"/>
    </view>
</template>
<script>
// import 

export default {
    data() {
        return {
            foo: ''
        }
    },
    onLoad(query) {
        this.foo = query.foo;
    }
}
</script>
// Child.vue

<template>
    <view>{{foo}}</view>
</template>
<script>
export default {
    props:['foo']
}
</script>
a5g8bdjr

a5g8bdjr5#

在淘宝小程序里运行,重现步骤:在onLoad里改变foo的值会触发这个bug,但如果是在mounted里放到一个延迟函数了有一定几率不会触发。prop与类型无关,功能上看起来是正常的。

// Parent.vue
<template>
    <view>
        <Child :foo="foo"/>
    </view>
</template>
<script>
// import 

export default {
    data() {
        return {
            foo: ''
        }
    },
    onLoad(query) {
        this.foo = query.foo;
    }
}
</script>
// Child.vue

<template>
    <view>{{foo}}</view>
</template>
<script>
export default {
    props:['foo']
}
</script>

你好,请问最后这个bug解决了吗?

相关问题