4***@qq.com
4***@qq.com
  • 发布:2020-05-19 09:05
  • 更新:2020-05-19 09:05
  • 阅读:900

【报Bug】安卓端 cover-image 自定义组件中不显示 image 自定义组件中不能动态变更src

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: windows10.0.17763 暂缺 Build 17763

HBuilderX类型: Alpha

HBuilderX版本号: 2.7.4

手机系统: Android

手机系统版本号: Android 9.0

手机厂商: 华为

手机机型: BND-AL10

页面类型: vue

打包方式: 云端

项目创建方式: HBuilderX

示例代码:

testCom1.vue

<template>  
    <view><slot name="test"></slot></view>  
</template>  
<script>  
export default {  
    data() {  
        return {};  
    }  
};  
</script>  
<style></style>  

testCom.vue

<template>  
    <view>  
        <slot name="test1"></slot>  
        <testCom1>  
            <template #test>  
                <slot name="test2"></slot>  
            </template>  
        </testCom1>  
    </view>  
</template>  
<script>  
import testCom1 from '@/components/custom/testCom1';  
export default {  
    components: { testCom1 },  
    data() {  
        return {  
            title: 'image'  
        };  
    }  
};  
</script>  
<style></style>  

test.vue

<template>  
    <view class="page">  
        <view>页面image组件</view>  
        <view class="image-list"><image style="width: 200px; height: 200px; background-color: #eeeeee;" mode="scaleToFill" :src="src"></image></view>  
        <test-com>  
            <!-- <template v-slot:test1>  
                <view>自定义组件一层嵌套image组件</view>  
                <view class="image-list"><image style="width: 200px; height: 200px; background-color: #eeeeee;" mode="scaleToFill" :src="src"></image></view>  
            </template> -->  
            <template v-slot:test2>  
                <view>自定义组件两层嵌套image组件</view>  
                <view class="image-list"><image style="width: 200px; height: 200px; background-color: #eeeeee;" mode="scaleToFill" :src="src"></image></view>  
            </template>  
        </test-com>  
    </view>  
</template>  
<script>  
import testCom from '@/components/custom/testCom';  
export default {  
    components: { testCom },  
    data() {  
        return {  
            image:  
                'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1589803672629&di=1d365548a9124df499347debe6201e17&imgtype=0&src=http%3A%2F%2Fcdn.duitang.com%2Fuploads%2Fitem%2F201305%2F12%2F20130512095153_WSu5Q.jpeg'  
        };  
    },  
    computed: {  
        src() {  
            const ths = this;  
            return `${ths.image}`;  
        }  
    },  
    onLoad() {  
        const ths = this;  
        setTimeout(() => {  
            ths.image =  
                'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1589803718737&di=a5dcf1315a8d9add484ed33ba4479f4a&imgtype=0&src=http%3A%2F%2Fi0.hdslb.com%2Fbfs%2Farticle%2F98f3d522c930d58fdc58bdabe74bdb823454da84.jpg';  
        }, 1000 * 3);  
    },  
    methods: {}  
};  
</script>  

<style></style>

操作步骤:

经测试复现次bug需要出现多层自定义组件的嵌套;
1.在一个自定义组件中用v-slot渲染cover-image
2.在一个自定义组件中用v-slot渲染img,src属性设为绑定属性,data里设置初始值,onLoad里面写一个setTimeOut进行动态变更src

预期结果:

1.cover-image渲染显示
2.image渲染显示动态变更之后的src图片

实际结果:

1.cover-image组件不显示
2.image组件仅显示第一次加载的src图片,变更src无任何效果

bug描述:

安卓端
1.cover-image 自定义组件中不显示

  1. image 自定义组件中不能动态变更src,仅能首次加载显示
2020-05-19 09:05 负责人:无 分享
已邀请:

该问题目前已经被锁定, 无法添加新回复