유 니 앱 은 countdown 플러그 인 을 사용 하여 카운트다운 을 실현 합 니 다.

본 논문 의 사례 는 countdown 플러그 인 을 사용 하여 카운트다운 을 실현 하 는 구체 적 인 코드 를 공유 하 였 으 며,여러분 께 참고 하 시기 바 랍 니 다.구체 적 인 내용 은 다음 과 같 습 니 다.
실현 효 과 는 다음 과 같다.

여기 서 실 현 된 것 은 활동 카운트다운 입 니 다.현재 시간 과 활동 시작 시간 을 얻 고 서로 줄 어 든 시간 차 는 바로 우리 가 필요 로 하 는 카운트다운 입 니 다.플러그 인 을 사용 하 는 것 은 매우 편리 하 다.
먼저 새 항목 을 만 들 고 유 니 앱 을 선택 하 십시오.템 플 릿 은 hello-유 니 앱 을 선택 하 십시오.홈 페이지 가 있 는 구성 요 소 는 직접 사용 할 수 있 습 니 다.생 성 후 components 전체 폴 더 를 자신의 항목 으로 복사 합 니 다.

카운트다운 이 필요 한 페이지 에 구성 요 소 를 도입 합 니 다.

<script>
 import uniCountdown from '@/components/uni-countdown/uni-countdown.vue'
 export default {
 data() {
  return {
  d:'',
  h:'',
  m:'',
  n:''
  }
 },
 
 components:{
  uniCountdown
 }
 }
</script>

페이지 에 타이머 위 치 를 설정 합 니 다.

<view class="created" v-if="myData.stat == '   '">
 <span>    </span>
 <span class="timer">
    <uni-countdown :day="d" :hour="h" :minute="m" :second="s"></uni-countdown>
  </span>
</view>

타이머 에 연 결 된 시간 d,h,m,s 를 계산 합 니 다.

var date = new Date();
  var now = date.getTime();
  var star = this.myData.startTime
  var endDate = new Date(star); 
  var end = endDate.getTime(); 
  var leftTime = end-now;
  if (leftTime >= 0) {
 this.d = Math.floor(leftTime/1000/60/60/24); 
 this.h = this.myData.validTime+Math.floor(leftTime/1000/60/60%24); 
 this.m = Math.floor(leftTime/1000/60%60); 
 this.s = Math.floor(leftTime/1000%60);
 console.log(this.d+' '+this.h+' '+this.m+' '+this.s+' ')
}

전체 코드:

<template>
  <view class="created">
 <span>    </span>
 <span class="timer">
      <uni-countdown :day="d" :hour="h" :minute="m" :second="s"></uni-countdown>        
    </span>
 </view>
</template>
<script>
 import uniCountdown from '@/components/uni-countdown/uni-countdown.vue'
 export default {
 data() {
  return {
  d:'',
  h:'',
  m:'',
  n:'',
  }
 },
 onLoad(option){
  this.init()
 },
 
 methods: {
  init(){
        var date = new Date();
  var now = date.getTime();//       1970 1 1         
  var star = this.myData.startTime
  var endDate = new Date(star); 
  var end = endDate.getTime();//     1970 1 1         
  var leftTime = end-now;//             
  if (leftTime >= 0) {
   this.d = Math.floor(leftTime/1000/60/60/24);
   this.h = Math.floor(leftTime/1000/60/60%24); 
   this.m = Math.floor(leftTime/1000/60%60); 
   this.s = Math.floor(leftTime/1000%60);
   console.log(this.d+' '+this.h+' '+this.m+' '+this.s+' ')
  }
      }
    },
 components:{
  uniCountdown
 }
 }
</script>

이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.