功能描述
同时生成七个不相同的随机数字,当点击开始,数字开始变化,变化时间为0.3秒,当点击结束,数字停止。
实现步骤
- 第一、定义一个函数,功能是:生成七个不相同的数字的,并且数字范围为1-35,类型为整数。
- 第二、定义start开始事件。start事件使用setInterval定时器,时间300ms,也就是每个300ms就去调用生成数字的函数。
- 第三、定义end结束时间。点击结束时间,数字停止。
代码实现
Page({
data: {
nameValue:'',
randomNumbers: [],
intervalId: null,
isRandoming: false,
},
generateRandomNumbers() {
let numbers = [];
while (numbers.length < 7) {
const num = Math.floor(Math.random() * 49) + 1;
if (numbers.indexOf(num) === -1) {
numbers.push(num);
}
}
return numbers;
},
start() {
this.setData({
nameValue:''
})
if (this.data.isRandoming) {
return;
}
const intervalId = setInterval(() => {
const numbers = this.generateRandomNumbers();
this.setData({
randomNumbers: numbers,
});
}, 300);
this.setData({
intervalId: intervalId,
isRandoming: true,
});
},
end() {
if (!this.data.isRandoming) {
return;
}
clearInterval(this.data.intervalId);
this.setData({
intervalId: null,
isRandoming: false,
});
},
//wxml
//数据显示
<view wx:for="{{randomNumbers}}" wx:key="index">{{item}}</view>
//开始
<button bindtap="start">开始</button>
//结束时间
<button bindtap="end">结束</button>