добавление события mouseup для диапазона в реакции

Question

Я пытаюсь создать событие, похожее на onmouseup, на моем слайдере (введите html-тег с type = range) в моей функции реагирования рендеринга.Я хотел бы сделать

<input id="slider" type="range" min="1" max="100" value={this.state.input_val} onChange={this.handleChange} onmouseup={this.handleSubmit}  />

Но вы не можете добавить событие onmouseup.Второе, что я попробовал, это добавление addEventListener, который также не удался, вероятно, из-за всех правил привязки реагирования.

this.slider.addEventListener('mouseup', e => {
        this.handleSubmit()
});

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

Answer 1

React использует «синтетические события», обертку вокруг собственных событий браузера, чтобы сгладить совместимость браузера.Вы уже используете один для onChange.Соответствующее синтетическое событие для onmouseup - это onMouseUp (с другой прописной буквой):

<input id="slider" type="range" min="1" max="100" value={this.state.input_val} onChange={this.handleChange} onMouseUp={this.handleSubmit}  />

Для каждого встроенного события существует соответствующее синтетическое событие.Проверьте https://reactjs.org/docs/events.html#mouse-events для списка всех событий мыши.