如何用alpinejs制作一个机选摇号器

<div class="container" x-data="jixuan()" x-init="() => {getRandFive()}">
    <h1>双色球机选五注</h1>
    <div class="jixuan">
        <ul class="jx-list">
            <template x-for="(zu, index) in five" :key="index">
                <li>
                    <template x-for="i in zu"><span x-text="i"></span></template>
                </li>
            </template>
        </ul>
    </div>
    <div class="caozuo">
        <button @click="runningFive" x-text="beginbtn"></button>
    </div>
</div>
<script>
    window.jixuan = function() {
        return {
            allredball: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31', '32', '33'],
            allblueball: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16'],
            five: [],
            interval: null,
            beginbtn: '开始摇号',
            getRandomArrayElements(arr, count) {
                let shuffled = arr.slice(0),
                    i = arr.length,
                    min = i - count,
                    temp, index;
                while (i-- > min) {
                    index = Math.floor((i + 1) * Math.random());
                    temp = shuffled[index];
                    shuffled[index] = shuffled[i];
                    shuffled[i] = temp;
                }
                return shuffled.slice(min);
            },
            getRandFive() {
                let a = [],
                    b = [];
                let reds = this.allredball;
                let blues = this.allblueball;
                for (let i = 0; i < 5; i++) {
                    b = this.getRandomArrayElements(reds, 6).sort((a, b) => {
                        return a - b
                    });
                    b.push(this.getRandomArrayElements(blues, 1)[0]);
                    a.push(b);
                }
                this.five = a;
            },
            runningFive() {
                const that = this
                if (this.interval == null) {
                    this.beginbtn = '停止摇号';
                    this.interval = setInterval(function() {
                        that.getRandFive();
                    }, 60)
                } else {
                    this.beginbtn = '开始摇号';
                    clearInterval(this.interval);
                    this.interval = null;
                }
            }
        }
    }
</script>

alpine.js可以说是非常简单的一个js框架了，相对于vue或其他框架而言不论是功能还是文档都非常的轻量化，这个工具是我边看文档边写的；这里省去了css代码。

 alpine.js中文文档：https://www.alpinejs.cn/

具体效果可以参考演示地址：https://shuangseqiu.wangzhanb.com/jixuan.html