反応5分钟写一个乐透开奖
1206 ワード
先放个效果图
import { useState } from 'react';
const Lottery = () => {
const [pool,setPool]=useState([]) // 设置奖池初始值
// 生成一个随机数字
const randomNumber = (min, max) =>{
const range = max - min + 1;
const rand = Math.random() ;
const num = Math.floor(rand * range + min);
return num;
}
// 奖池生成器
const generator = (n,min,max)=>{
const arr = [];
while(arr.length<n){
const num = randomNumber(min,max)
if (arr.indexOf(num)===-1){
arr.push(num)
}
}
return arr;
}
return (
<div>
<button onClick={()=>setPool(generator(6,1,45))}>一键开奖</button>
<button onClick={()=>setPool([])}>清空奖池</button>
<div className="lottery">
<ul>
{pool.map((num,i)=>(<li key={i}><div>{num}</div></li>))}
</ul>
</div>
</div>
);
};
export default Lottery;
Reference
この問題について(反応5分钟写一个乐透开奖), 我々は、より多くの情報をここで見つけました https://dev.to/kongfuboy123/react-5fen-zhong-xie-ge-le-tou-kai-jiang-37hlテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol