js随机生成颜色的数量(微信小程序)

wxml文件

<!--
  实现随机颜色
  -->
<view class="box" wx:for="{{ colorString }}" style="background-color: {{ item }};" wx:key="idex"> 
  {{ item }}
</view>

css样式文件

.box {
  background-color: aqua;
  border-radius: 10px;
  line-height: 200rpx;
  text-align: center;
  margin: 20px;
  /*文本阴影效果*/
  text-shadow: 0rpx 0rpx 5rpx #fff;
  /*盒子阴影效果*/
  box-shadow: 0rpx 0rpx 6rpx #aaa;
}

js文件

// pages/one/one.js
Page({
  /**
   * 页面的初始数据
   */
  data: {
    //声明十六进制颜色数组
    colorString : new Array(),

    //声明颜色数组的行数
    row : 100
  },
  /**
   * 设置随机颜色
   */
  getData() {
  	//获取data域的变量值
    var {row , colorString} = this.data
    //设置组成十六进制颜色字符的数组
    var ColorCharacter = ["0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F"];
    /**
     * 进行循环遍历，并且进行数组赋值
     */
    for(var i = 0; i < row; i++){
      //每行第一个字符为#开头，例如：#efefef
      var HomeNumber = "#"
      //进行列的遍历[注意：要想实现随机颜色的生成，必须是6位数组成的#efefef]
      for(var j = 0; j < 6; j++){
        /**
         * 进行随机获取十六进制的颜色数值
         * 这里为什么要*16，因为Rand范围是[0 , 1)范围，
         * 得出0.99*16 = 15.84，又进行向下取整所以15，对应ColorCharacter下标值
         * 
         */
        var NumberRand = Math.floor(Math.random() * 16)
        //进行字符相加
        HomeNumber += ColorCharacter[NumberRand]
      }
       //添加到声明十六进制颜色数组
       colorString[i] = HomeNumber
    }
    this.setData({
    	//初始化数组
        colorString
      })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    //加载页面执行设置随机颜色方法
    this.getData()

   
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作（实现下拉刷新功能）
   */
  onPullDownRefresh : function() {
  
  },

  /**
   * 页面上拉触底事件的处理函数(上拉刷新功能)
   */
  onReachBottom : function() {
    console.log('上拉刷新功能触发了')
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})