Как получить минимальные максимальные значения noUiSlider при обновлении? - PullRequest
0 голосов
/ 07 января 2019

Я пытаюсь использовать noUiSlider для фильтрации своих результатов. Я использовал компонент noUiSlider, чтобы показать слайдер. Слайдер показывает, но я не могу получить минимальные максимальные значения на слайде. Я хочу, чтобы показать целочисленные минимальные максимальные значения в текстовом поле и использовать их для фильтра.

вот как я импортирую noUislider

import '../../node_modules/nouislider/distribute/nouislider.css';
import Nouislider from 'react-nouislider';

<Nouislider
range={{min: 0, max: 800000}}
start={[20000, 500000]}
onSlide={this.onChangeSlide.bind(this)}
ref="NoUiSlider"
tooltips/>

Я использовал метод onchange slide для получения значений, но он не работает

onChangeSlide(){
   console.log(this.refs.NoUiSlider.slider.get()) // logs the value
}

Как я могу получить значения Пожалуйста, помогите мне

1 Ответ

0 голосов
/ 07 января 2019

onSlide обратный вызов уже дает вам данные, вам просто нужно добавить переменную, чтобы получить данные.

onSlide={(data)=> console.log(data)}

чек это

Демо

Вы можете просто добавить onChangeSlide как обычную функцию. если вы хотите получить данные внутри этого.

 onChangeSlide(data) {
    console.log(data) // logs the value
  }


 <Nouislider
        range={{ min: 0, max: 800000 }}
        start={[20000, 500000]}
        onSlide={this.onChangeSlide.bind(this)}
        ref="NoUiSlider"
        tooltips />
...