1 В избранное 0 Ответвления 0

OSCHINA-MIRROR/null_639_5368-mv-count-down

Присоединиться к Gitlife
Откройте для себя и примите участие в публичных проектах с открытым исходным кодом с участием более 10 миллионов разработчиков. Приватные репозитории также полностью бесплатны :)
Присоединиться бесплатно
Клонировать/Скачать
Внести вклад в разработку кода
Синхронизировать код
Отмена
Подсказка: Поскольку Git не поддерживает пустые директории, создание директории приведёт к созданию пустого файла .keep.
Loading...
README.en.md

Компонент обратного отсчёта времени в Vue

Настройка проекта

yarn add mv-count-down

или

npm i mv-count-down

Использование компонента в проекте

<template>
  <div class="home">
    <mv-count-down @startCallback="countDownS"
                   @endCallback="countDownE"
                   :startTime="startTime"
                   :endTime="endTime"
                   :endText="endText"
                   :dayTxt="'day'"
                   :hourTxt="'hours'"
                   :minutesTxt="'minutes'"
                   :secondsTxt="'seconds'"
                   :isStart="isStart"></mv-count-down>
    <a class="link-blue"
       href="https://gitee.com/null_639_5368/mv-count-down/blob/master/src/views/Home.vue">Посмотреть демо</a>
  </div>
</template>

<script>
import MvCountDown from '@/components/MvCountDown'

export default {
  name: 'home',
  components: {
    MvCountDown
  },
  data () {
    return {
      startTime: new Date().getTime(),  // Время начала (отметка времени)
      endTime: 0,      // Время завершения (отметка времени)
      endText: '',     // Текст подсказки по завершении обратного отсчета
      isStart: false   // Управление временем начала обратного отсчета (начало асинхронного запроса)
    }
  },
  created () {
    this.setEndTime(10);
  },
  methods: {
    callback () {
      // кодирование .......
    },
    // Устанавливает задержку времени окончания и преобразует метку времени
    setEndTime (value) {
      let curTime = new Date();
      let newTime = new Date(curTime.setSeconds(curTime.getSeconds() + value));
      this.endTime = newTime.getTime();
      this.isStart = true;
    },
    countDownS (x) {
      // Обратный отсчет callback
      console.log(x)
    },
    countDownE () {
      // Завершение обратного отсчета callback
      this.callback();
    }
  }
}
</script>

Комментарии ( 0 )

Вы можете оставить комментарий после Вход в систему

Введение

Описание недоступно Развернуть Свернуть
MIT
Отмена

Обновления

Пока нет обновлений

Участники

все

Недавние действия

Загрузить больше
Больше нет результатов для загрузки
1
https://api.gitlife.ru/oschina-mirror/null_639_5368-mv-count-down.git
git@api.gitlife.ru:oschina-mirror/null_639_5368-mv-count-down.git
oschina-mirror
null_639_5368-mv-count-down
null_639_5368-mv-count-down
master