> For the complete documentation index, see [llms.txt](https://bogdanov-inc.gitbook.io/ui-konstruktor-oktell/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bogdanov-inc.gitbook.io/ui-konstruktor-oktell/kontroly/taimer.md).

# Таймер

![](https://899924798-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FzcMn1glkgcrvuggFcDlD%2Fuploads%2F48ghrMeuOAiGNddarBCI%2Ftime.png?alt=media\&token=b9bd714d-cb9b-475d-bf86-f02963ca5fe0)

Компонент для создания таймера.

**Свойства:**

* *<mark style="color:purple;">initialValue</mark>* - начальное значение в секундах
* *<mark style="color:purple;">value</mark>* - текущее значение в секундах
* *<mark style="color:purple;">step</mark>* - время в секундах через которое таймер будет обновлять значение
* *<mark style="color:purple;">minValue</mark>* - значение в секундах с которого начнется отсчет
* *<mark style="color:purple;">maxValue</mark>* - значение в секундах на котором закончится отсчет
* *<mark style="color:purple;">format</mark>* - маска по которой отображается время, например **00:00** или **00:00:00**, про другие значения можно прочитать [тут](http://numeraljs.com/#format-time).
* *<mark style="color:purple;">autoRestart</mark>* - если установлено *<mark style="color:purple;">maxValue</mark>*, при достижении текущего значения отсчет начнется сначала
* *<mark style="color:purple;">isStopped</mark>* - остановка таймера
* *<mark style="color:purple;">color</mark>* - выбор цвет таймера
* *<mark style="color:purple;">eventStep</mark>* - время в секундах через которое будет запускаться событие *<mark style="background-color:purple;">onStepTime</mark>*. Работает только если установлено событие *<mark style="background-color:purple;">onStepTime</mark>*.&#x20;

**События:**

* *<mark style="background-color:purple;">onClick</mark>* - событие срабатывает по клику на таймер
* *<mark style="background-color:purple;">onMinTime</mark>* - событие срабатывает при равенстве текущего значения (*<mark style="color:purple;">value</mark>*) и минимального значения (*<mark style="color:purple;">minValue</mark>*)
* *<mark style="background-color:purple;">onMaxTime</mark>* - событие срабатывает при достижении максимального значения (*<mark style="color:purple;">maxValue</mark>*)
* *<mark style="background-color:purple;">onStepTime</mark>* - событие срабатывает при изменении *<mark style="color:purple;">value</mark>*, частоту срабатывания можно задать свойством *<mark style="color:purple;">eventStep</mark>*
