首页 > 编程语言 >在线直播系统源码,默认倒计时,自定义输入时间倒计时

在线直播系统源码,默认倒计时,自定义输入时间倒计时

时间:2023-05-04 14:13:34浏览次数:50  
标签:code 自定义 get 默认 倒计时 源码 time

在线直播系统源码,默认倒计时,自定义输入时间倒计时

html部分代码

 

<div id="app">
    <input type="num" v-model="time">
    <input type="button"  @click="click_input(time)" value="点击">
    <div>{{ get_code }}</div>
</div>
 

js部分代码

 

var app = new Vue({
  el: '#app',
  data() {
    return {
       time:60,// 默认为60秒倒计时,可以输入修改
       get_code:'输入上方倒计时数字 -- 默认60',// 倒计时数字
    }
  }, 
  methods: {
    // 点击倒计时
    click_input(time){
        this.count_down(time)
    },
    // 倒计时
count_down(time){
// 开始倒计时
var time_lang = time
this.get_code = '正在计时' + time + 's'
var time_stop = setInterval(()=>{
--time_lang
if(time_lang > 0){ // 时常大于0
this.get_code = '正在计时' + time_lang + 's'
}else{ // 倒计时小于0
time_lang = time
                this.get_code = '倒计时结束'
clearInterval(time_stop)
}
},1000)
},
  }
});

 

 以上就是在线直播系统源码,默认倒计时,自定义输入时间倒计时, 更多内容欢迎关注之后的文章

 

标签:code,自定义,get,默认,倒计时,源码,time
From: https://www.cnblogs.com/yunbaomengnan/p/17371050.html

相关文章

  • @Import注解原理源码分析
    文章结构@Import注解源码的入口位置@Import注解原理收集@Import注解处理收集的imports@Import注解源码的入口位置源码的入口位置在ConfigurationClassParser#doProcessConfigurationClass方法中,至于为什么是这个位置,先按下不表后续会填坑完善。Spring如何解析配置类先简单看下Spr......
  • 【HarmonyOS】自定义组件之ArkUI实现通用标题栏组件
     【关键字】标题栏、常用内置组件整合、ArkUI、自定义组件 1、写在前面在上一篇文章中我们通过Java语言实现了一个通用的标题栏组件,有需要的可以看下,文章地址:https://developer.huawei.com/consumer/cn/forum/topic/0202117373459738584?fid=0101587866109860105现在很多......
  • 从Spring源码分析@Autowired依赖注入实现原理
    在平常项目开发中,使用@Autowired注解进行字段注入很常用,本篇就通过Spring源码,重点分析这种方式实现依赖注入的过程。本篇Spring源码版本为5.1.7.RELEASE。在源码中,关键类是AbstractAutowireCapableBeanFactory,这个类继承AbstractBeanFactory,所以在Spring上下文启动......
  • 【开源项目】智慧污水水厂~国企污水厂数字孪生可视化项目——开源工程及源码
    国企某大型污水厂的工程和源码免费送!实现智慧污水厂的数字孪生,轻松掌控厂内运行情况!项目介绍智慧污水厂采用数字孪生技术,将现实中的数据和场景完整地克隆到虚拟现实中,展现污水厂的精细化管理,可视化厂内设备、管道等的具体运行情况,大幅提高了工作效率,为产业发展注入新动力。智慧水厂......
  • AQS源码分析
    AQS源码分析--哔哩哔哩(通俗易懂)AQS实现原理看这一篇就够了 ......
  • java基于springboot+vue非前后端分离的网上商城购物系统、在线商城管理系统,附源码+数
    1、项目介绍java基于springboot+vue非前后端分离的网上商城购物系统、在线商城管理系统,实现管理员:首页、个人中心、用户管理、商品分类管理、商品信息管理、订单评价管理、系统管理、订单管理,用户;首页、个人中心、订单评价管理、我的收藏管理、订单管理,前台首页;首页、商品信息、......
  • 自定义函数实现分组统计
    1.通过自定义的函数实现分组统计: 2.自定义函数,对索引进行修改取不同产品名称的数量: ......
  • 魔兽世界服务端自定义添加NPC教程
    魔兽世界自定义NPC教程大家好,我是艾西今天跟大家聊一下自定义NPC,自定义NPC可以添加自己想要售卖的物品以及定价等可以更好的将一个游戏设定以及游戏的拓展性有质的提升creature表是游戏所有生物人物等表格Creature_template是所有生物模板,根据生物模板可以创建很多的生物。我们在某......
  • 【SpringBoot系列】三、SpringBoot特性_SpringApplication类(自定义Banner)
        SpringApplication类作为SpringBoot最基本、最核心的类,在main方法中用来启动SpringBoot项目。一般情况下,只需在main方法中使用SpringApplication.run静态方法来启动项目:packagecom.xcbeyond.springboot;importorg.springframework.boot.SpringApplication;importorg.......
  • 母亲节倒计时,选礼物救急指南
    By超神经场景描述:选礼物是千古大难题之一,母亲节来临之际,借助机器学习、大数据分析、图像增强等AI技术,可以帮你为母亲送上一份走心的礼物。关键词:母亲节 机器学习大数据图像增强神经网络 母亲节了,你为母亲大人选好礼物了吗?   要让礼物达到美观、实用兼具且能讨母上大人喜......