请教一下时间段的循环怎么实现

10点15分--10点30分，时间隔15分依次往后排。如何实现循环展示

该如何实现

用js生成数据源数组就行了，用Date对象循环setMinutes增加15分钟，直到超过结束时间，简单示例如下

<div id="app">
    <div v-for="item in ranges">
        {{item}}
    </div>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    Number.prototype.addZero = function () { if (this < 10) return '0' + this; return this.toString()}
    new Vue({
        el: '#app',
        data: {ranges:[]},
        created() {
            var d = new Date(),endDate=new Date();
            d.setHours(10); d.setMinutes(0);//开始时间 10:00
            endDate.setHours(12); endDate.setMinutes(0);//12:00结束
            var step = 15;
            while (true) {
                var s = '今天 ' + d.getHours().addZero() + ':' + d.getMinutes().addZero();
                d.setMinutes(d.getMinutes() + step);
                s += '-' + d.getHours().addZero() + ':' + d.getMinutes().addZero();
                if (d > endDate) break;
                this.ranges.push(s)

            }
            
            
        }
    })
    var d = new Date()
    d.setMinutes()

</script>

可以用 moment.js
moment().add(15, 'm');

     let total = 24; // 总共小时数目

      // 遍历
      for (let i = 0; i <= 24; i++) {
        let hour = i;
        let next = `${hour + 1}:00`;
        if (hour == "24") {
          curr = "00";
        }
        if (next == "25:00") {
          next = "1:00";
        }

        let curr = `${hour}:00`;
        let half15 = `${hour}:15`;
        let half30 = `${hour}:30`;
        let half45 = `${hour}:45`;

        console.log(`${curr} - ${half15}`);
        console.log(`${half15} - ${half30}`);
        console.log(`${half30} - ${half45}`);
        console.log(`${half45} - ${next}`);
      }

您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！
PS：问答VIP年卡 【限时加赠：IT技术图书免费领】，了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632