5***@qq.com
5***@qq.com
  • 发布:2022-04-21 17:48
  • 更新:2022-04-21 18:11
  • 阅读:131

【报Bug】微信小程序输入框BUG

分类:uni-app

产品分类: uniapp/小程序/微信

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 21H1-19043.1586

HBuilderX类型: 正式

HBuilderX版本号: 3.4.6

第三方开发者工具版本号: 1.06.2203070

基础库版本号: 2.23.4

项目创建方式: HBuilderX

示例代码:
<template>  
    <view class="wrap">  
        <view class="top"><u-search @custom="searchList" @search="searchList" placeholder="请输入搜索条件" v-model="keyword"></u-search></view>  
        <loading-list top="80rpx" bottom="100rpx" ref="list" url="/stock" class="member-list">  
            <view slot="list" slot-scope="{ list }">  
                <view v-for="(item, index) in list" :key="index" class="member-item">  
                    <view class="member-left">  
                        <view class="avatar-box"  :style="{'background-color':getRandomColor( item )}">  
                            {{ item.Name[0] }}  
                        </view>  
                    </view>  
                    <view class="member-info">  
                        <view>{{ item.Name }}</view>  
                        <view>{{ item.Price }}/{{ item.Specs }}</view>  
                        <view>库存: {{ item.Quantity }}</view>  
                    </view>  
                    <view class="ico"><u-icon name="arrow-right" color="#909399" size="20"></u-icon></view>  
                </view>  
            </view>  
        </loading-list>  
    </view>  
</template>  

<script>  
import LoadingList from '@/components/page-lists/loading-list.vue';  

export default {  
    data() {  
        return {  
            listData: [],  
            listQuery: {},  
            keyword: ''  
        };  
    },  
    components: {  
        LoadingList  
    },  
    computed: {  

    },  
    methods: {  
        searchList() {  
            this.listQuery = {  
                Name: this.keyword  
            };  
            this.$refs.list.loadList(this.listQuery, true);  
        },  
        getRandomColor(item) {  
            console.log(item)  
                    const rgb = []  
                    for (let i = 0; i < 3; ++i) {  
                        let color = Math.floor(Math.random() * 256).toString(16)  
                        color = color.length == 1 ? '0' + color : color  
                        rgb.push(color)  
                    }  
                    return '#' + rgb.join('')  
                }  
    }  
};  
</script>  

<style lang="scss" scoped>  
@import './index.scss';  
</style>  

操作步骤:

v-for循环遍历数组,并且给每个创建的图片组件设置一个随机背景色,randomColor每执行一个都会返回一个随机的rgb颜色,但是这个方法被多次执行。

预期结果:

输入文字时randomColor方法不执行

实际结果:

输入文字时randomColor方法执行

bug描述:

小程序BUG

每次在输入框输入完文字后,getRandomColor这个方法总是被调用一次

2022-04-21 17:48 负责人:无 分享
已邀请:
5***@qq.com

5***@qq.com (作者)

各位大哥 - -,给看看啊

小枫叶

小枫叶 - 外包接单加v:wlmk1234567 注明来意

只有小程序这样?

  • 5***@qq.com (作者)

    H5没问题,其他平台暂时没有测试

    2022-04-21 18:20

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