微信小程序彩票号码生成器javascript技巧

设计一个小程序，生成一注7个彩票号码(1-31)，并在圆形图标上显示，加上一个按钮，每点一次重新生成，同时生成不同的颜色圆形图标。

1）index.wxml文件

彩票生成器生成的彩票序列：{{item}}{{a}}{{b}}{{c}}{{d}}{{e}}{{f}}{{g}}==================================生成新的彩票号码2）index.wxss文件

/**index.wxss**/.box{margin:20rpx;padding:20rpx;border:3pxdashedrgb(248,72,2);background-color:rgba(110,144,216,0);}.title{font-size:30px;text-align:center;margin-bottom:15px;color:rgb(59,15,252);}.context{display:flex;text-align:center;line-height:100rpx;font-weight:bolder;color:rgb(28,3,56);}.item{flex-grow:1;border-radius:50px;}3）index.js文件

在index.wxml文件代码中，利用1个view内部嵌套7个view组件的方法实现七个“彩球”的界面设计。并在下面添加一个button组件，该组件绑定点击事件，实现生成新的彩票号码。

在index.js文件中，定义了createRand（）函数，用于产生随机数列，该函数首先利用for循环产生7个随机数并将这些数据添加到数组中。Math.random（）函数用于产生0～1之间的随机数，Math.random()*32能够产生0～32之间的随机数，(r/Math.pow(10,2)).toFixed(2).substr(2)可控制随机生成的r为两位数，同时在一位数之前补“0”。定义的onLoad函数和newRand函数，通过this.sarData()方法将结果渲染到视图层。

本案还涉及了在JavaScript中创建随机颜色的方法。创建颜色的设计思想是：利用Math.random()和Math.floor()函数从构成颜色的16个十六进制字符(0~F)中随机找出6个字符构成一种颜色，连续找7次就可以生成7种随机颜色。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。