Passa al contenuto principale

Slider Input

Un componente di ingresso a cursore. Può essere utilizzato come parte di un cruscotto ISLE o autonomo. In quest'ultimo caso, si vuole gestire le modifiche tramite l'attributo onChange o legare il valore ad una variabile globale tramite l'attributo bind.

Opzioni#

  • defaultValue | number: Il valore di partenza del cursore. Default: 10.
  • disabled | boolean: controlla se l'ingresso cursore è attivo o meno. Se impostato su true, il cursore sarà presente sullo schermo, anche se in grigio. Default: false.
  • inline | boolean: controlla se posizionare il cursore in linea con il testo o all'esterno. Default: false.
  • legend | (string|node): didascalia dell'ingresso. Default: none.
  • max | number: Il valore massimo del cursore. Default: 100.
  • maxLabel | string: etichetta da visualizzare a destra del cursore al posto del valore massimo. Default: none.
  • min | number: Il valore minimo del cursore. Default: 0.
  • minLabel | string: etichetta da visualizzare a sinistra del cursore invece del valore minimo. Default: none.
  • onChange | function: richiamata con il nuovo valore quando cambia il valore dello slider. Default: onChange() {}.
  • precision | number: arrotondamento dell'ingresso. Il valore sarà arrotondato per non avere cifre più significative della precisione. Per esempio, se si desidera utilizzare solo numeri interi, si utilizzerà una precisione di 10, mentre se si desidera arrotondare al centinaio, si utilizzerà una precisione di 0,001. Default: 10.
  • step | (number|string): dimensione del passo del cursore. Default: 1.
  • hideTooltip | boolean: controlla se nascondere il tooltip. Default: false.
  • style | object: Stili in linea CSS. Default: {}.
  • numberInputStyle | object: Stili in linea CSS per il componente di input del numero. Default: {}.
  • rangeInputStyle | object: Stile CSS in linea per il componente di ingresso della gamma. Default: {}.

Esempi#

Editore dal vivo
Risultato
ReferenceError: Provider is not defined