uni-app store-home组件appid数据绑定后显示错误

uni-app store-home组件appid数据绑定后显示错误

开发环境 版本号 项目创建方式
Windows 11 HBuilderX

示例代码:

<template>  
    <view class="storeView">  
        <view class="storeTitle">微信小店首页</view>  
        <store-home :appid="appid" />  
        <view class="storeTitle">微信小店商品</view>  
        <store-product :appid="appid" :productId="productId" />  
    </view>  
</template>  

<script>  
export default {  
    data() {  
        return {  
            appid: 'wx34ac10017......',  
            productId: '10000212......'  
        }  
    }  
}  
</script>

操作步骤:

<template>  
    <store-home :appid="appid" />  
</template>  

<script>  
export default {  
    data() {  
        return {  
            appid: 'wx34ac10017......'  
        }  
    }  
}  
</script>

预期结果:

微信小店正常显示

实际结果:

微信小店显示空白

bug描述:

问题:store-home组件appid直接在行内赋值,显示正确,用数据绑定之后,无法显示; 验证:

  1. store-product组件的appid和productId数据绑定之后,可以正常显示
  2. 在原生微信小程序中store-home组件appid用数据绑定的,可以正常显示store-home内容
  3. 图片为示例代码在开发者工具中的显示情况

更多关于uni-app store-home组件appid数据绑定后显示错误的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

暂时判断,可能是微信做出了限制应该,你可以通过加一个 v-if 来解决

更多关于uni-app store-home组件appid数据绑定后显示错误的实战教程也可以访问 https://www.itying.com/category-93-b0.html


已解决,十分感谢!

根据描述,问题可能出在uni-app的数据绑定机制与store-home组件的配合上。以下是可能的原因和解决方案:

  1. 数据绑定时机问题:store-home组件可能在created/mounted阶段就读取appid,但此时数据还未绑定完成。建议在onReady生命周期中设置appid。

  2. 响应式问题:确保appid是响应式数据。可以尝试:

this.$set(this, 'appid', 'wx34ac10017......')
  1. 组件兼容性问题:uni-app编译到小程序时可能存在差异。可以尝试:
<store-home :appid.sync="appid" />
回到顶部