Timer

Εμφανίζει ένα χρονόμετρο που θα ενεργοποιήσει μια προκαθορισμένη κλήση όταν λήξει ο χρόνος. Ένα παράδειγμα χρήσης είναι ο χρονισμός των κουίζ.

Επιλογές

id | string: το μοναδικό αναγνωριστικό string για τον χρονοδιακόπτη. Εάν έχει οριστεί ένα αναγνωριστικό, το στοιχείο του χρονοδιακόπτη είναι μόνιμο κατά την ανανέωση της σελίδας.. Default: none.
active | boolean (required): σημαία που μπορεί να ενεργοποιηθεί για την έναρξη ή την παύση του χρονοδιακόπτη. Default: none.
belowZero | boolean: ελέγχει αν ο χρονοδιακόπτης συνεχίζει να μετράει μετά την εξάντληση της διάρκειας. Default: false.
duration | number (required): διάρκεια σε δευτερόλεπτα για τον χρονοδιακόπτη. Default: none.
invisible | boolean: ελέγχει αν ο χρονοδιακόπτης θα πρέπει να είναι κρυμμένος. Default: false.
legend | string: κείμενο που εμφανίζεται μπροστά από το χρονόμετρο. Default: ''.
style | object: Στυλ γραμμής CSS. Default: {}.
onTimeUp | function: επανάκληση που καλείται όταν τελειώσει ο χρονοδιακόπτης. Default: onTimeUp() {}.

Live Editor

<Timer 
    id='test-quiz'
    active={true} 
    duration={50} 
    onTimeUp={() => {
      alert( 'done' );
    }}
/>

<Timer 
    id='test-quiz'
    active={true} 
    duration={50} 
    onTimeUp={() => {
      alert( 'done' );
    }}
/>

Αποτέλεσμα

ReferenceError: Provider is not defined