指定标签颜色随机变换

墨蓝 2022-11-07 04:05 179阅读 0赞

<div class="data_item" v-for="(item,index) in dataList" :key="index">
                <div class="data_item_name" :style="'background:'+item.bgColor">{
       {item.teamName}}</div>
                <div class="data_item_count">{
       {item.userCount}}</div>
            </div>

dataList: [],
    colors: ['#E8523F', '#156CEE', '#F8B849', '#1F998E'],

queryProjectUser() { 
                new Promise((resolve, reject) => { 
                    Api.queryProjectUser(this.projectId)
                        .then(response => { 
                            for (const iterator of response.result) { 
                                iterator.bgColor = this.rndElement(this.colors)
                            }
                            this.dataList = response.result
    
                        })
                        .catch(error => { 
                            reject(error);
                        });
                });
            },
            rnd(a, b) { 
                return Math.floor((b - a + 1) * Math.random()) + a
            },
            rndElement(arr) { 
                return arr[this.rnd(0, arr.length - 1)]
            },

![在这里插入图片描述][20210310190918471.png]

[20210310190918471.png]: /images/20221023/1b6cfc02f1ff4bc4958f4c717f7534d6.png

发表评论取消回复

表情：

评论列表（有 0 条评论，179人围观）

还没有评论，来说两句吧...

相关阅读

相关随机函数变换示例

说明本示例中基于 Java ，其他语言也有类似的 API 解决的问题问题1 Java 中 `Math.random()` 函数是等概率返回区间 `[0,1)

浅浅的花香味﹌/ 2024年04月08日 11:34/ 0 赞/ 81 阅读

相关色彩随机线性变换

有时候做一些颜色随机,需要变化,但是跨度太大不好看,最好有一个过度,就是改变一个色值,达成一个循环,这样变化看起来比较柔和. //获取一个随机颜色位置

川长思鸟来/ 2023年10月18日 16:34/ 0 赞/ 56 阅读

相关 Echarts 饼图设置标签颜色（单个标签颜色、多个标签颜色）

1 使用详解（1）series.data.label.color 说明：单个标签颜色。（2）series.label.color 说明：所有标签颜色。 2

- 日理万妓/ 2023年10月05日 12:07/ 0 赞/ 29 阅读

相关 jquery实现随机颜色_jQuery随机链接颜色动画

jquery实现随机颜色 We all know that we can set a link's :hover color, but what if we want to

叁歲伎倆/ 2023年02月22日 01:24/ 0 赞/ 20 阅读

相关指定标签颜色随机变换

<div class="data_item" v-for="(item,index) in dataList" :key="index">

墨蓝/ 2022年11月07日 04:05/ 0 赞/ 180 阅读

相关 JS获取随机颜色

var getRandomCOlor = function() { return '' + ('00000' + (Math.random() 0x100

灰太狼/ 2022年05月26日 13:45/ 0 赞/ 194 阅读

相关随机颜色

随机颜色开发工具与关键技术：JavaScript 作者：陈希雄撰写时间：2019/2/19 提醒：其实也可以拼接成自己想要的图形或者文字操

Love The Way You Lie/ 2022年03月18日 03:56/ 0 赞/ 227 阅读

相关 RGBA颜色随机函数

function randomRgbaColor() { //随机生成RGBA颜色 var r = Math.floor(Math.random() 256

我会带着你远行/ 2022年02月18日 08:25/ 0 赞/ 278 阅读

相关随机生成颜色代码

在网上找了随机生成16进制颜色码值 //随机生成颜色代码 public static String getColor()\{ //红色

骑猪看日落/ 2021年11月26日 23:50/ 0 赞/ 472 阅读

相关 JavaScript生成随机颜色

生成随机颜色代码 // rgb颜色随机 function rgb() { var r = Math.floor(Math.random()25

小鱼儿/ 2021年09月22日 00:54/ 0 赞/ 358 阅读