Overslaan naar hoofdinhoud

Slider Input

Een schuifregelaar-ingangscomponent. Kan worden gebruikt als onderdeel van een ISLE-dashboard of stand-alone. In het laatste geval wilt u veranderingen verwerken via het on-Change attribuut of de waarde binden aan een globale variabele via het bind attribuut.

Opties​

  • defaultValue | number: De startwaarde van de schuifregelaar. Default: 10.
  • disabled | boolean: regelt of de schuifingang actief is of niet. Indien ingesteld op true, zal de schuifregelaar op het scherm aanwezig zijn, zij het in het grijs. Default: false.
  • inline | boolean: bepaalt of de schuifregelaar in lijn met de tekst moet worden geplaatst of buiten de tekst. Default: false.
  • legend | (string|node): ondertiteling van de ingang. Default: none.
  • max | number: De maximale waarde van de schuifregelaar. Default: 100.
  • maxLabel | string: etiket dat rechts van de schuifregelaar moet worden weergegeven in plaats van de maximale waarde. Default: none.
  • min | number: De minimale waarde van de schuifregelaar. Default: 0.
  • minLabel | string: etiket dat links van de schuifregelaar moet worden weergegeven in plaats van de minimumwaarde. Default: none.
  • onChange | function: terugroeping aangeroepen met de nieuwe waarde wanneer de schuifregelaarwaarde verandert. Default: onChange() {}.
  • precision | number: afronding van de invoer. De waarde zal worden afgerond om niet meer significante cijfers te hebben dan de precisie. Als men bijvoorbeeld alleen gehele getallen wil gebruiken, wordt een precisie van 10 gebruikt, terwijl als men wil afronden naar de honderdste plaats een precisie van 0,001. Default: 10.
  • step | (number|string): stapgrootte van de schuifregelaar. Default: 1.
  • hideTooltip | boolean: controles om de tooltip te verbergen. Default: false.
  • style | object: CSS inline-stijlen. Default: {}.
  • numberInputStyle | object: CSS inline stijlen voor nummerinvoercomponent. Default: {}.
  • rangeInputStyle | object: CSS inline-stijl voor de ingangscomponent van het bereik. Default: {}.

Voorbeelden​

Live redacteur
Resultaat
ReferenceError: Provider is not defined