Siirry pääsisältöön

Slider Input

Liukusäätimen tulokomponentti. Voidaan käyttää osana ISLE-kojelautaa tai itsenäisesti. Jälkimmäisessä tapauksessa haluat käsitellä muutokset onChange-attribuutilla tai sitoa arvon globaaliin muuttujaan bind-attribuutilla.

Vaihtoehdot​

  • defaultValue | number: Liukusäätimen alkuarvo. Default: 10.
  • disabled | boolean: ohjaa, onko liukusäätimen tulo aktiivinen vai ei. Jos arvoksi asetetaan true, liukusäädin on näytössä, vaikkakin harmaana.. Default: false.
  • inline | boolean: valitsee, sijoitetaanko liukusäädin tekstin kanssa riviin vai sen ulkopuolelle.. Default: false.
  • legend | (string|node): syötteen kuvateksti. Default: none.
  • max | number: Liukusäätimen enimmäisarvo. Default: 100.
  • maxLabel | string: etiketti näytetään liukusäätimen oikealla puolella maksimiarvon sijasta.. Default: none.
  • min | number: Liukusäätimen vähimmäisarvo. Default: 0.
  • minLabel | string: merkintä näytetään liukusäätimen vasemmalla puolella minimiarvon sijasta.. Default: none.
  • onChange | function: callback, jota kutsutaan uudella arvolla, kun liukusäätimen arvo muuttuu.. Default: onChange() {}.
  • precision | number: syötteen pyöristäminen. Arvo pyöristetään siten, että siinä ei ole enempää merkitseviä numeroita kuin tarkkuus. Jos esimerkiksi halutaan käyttää vain kokonaislukuja, käytetään tarkkuutta 10, kun taas jos halutaan pyöristää sadasosaan, käytetään tarkkuutta 0,001.. Default: 10.
  • step | (number|string): liukusäätimen askelkoko. Default: 1.
  • hideTooltip | boolean: ohjaa, piilotetaanko työkaluvihje. Default: false.
  • style | object: CSS-inline-tyylit. Default: {}.
  • numberInputStyle | object: CSS-inline-tyylit numeron syöttökomponentille. Default: {}.
  • rangeInputStyle | object: CSS-inline-tyyli alueen syöttökomponentille. Default: {}.

Esimerkkejä​

Live Editor
Tulos
ReferenceError: Provider is not defined