Как увеличить/уменьшить цифру, которая указана в input по нажатию кнопки в ReactJS?

Я новичок в изучении ReactJS и столкнулся с такой задачей: Необходимо реализовать некое подобие функционала корзины онлайн-магазина. Рендерится некий компонент с карточкой товара Card и там есть поле input со значением "1" по умолчанию и кнопки "плюс" и "минус".

class Card extends React.Component {
  less() {
    ??????
  };

  more() {
    ??????
  };
  render() {
    return (
      <div className="product__count">
        <p className="product__count-title">Количество</p>
        <button onClick={this.less} className="product__btn-minus">-</button>
        <input className="product__count-input" value="1" />
        <button onClick={this.more} className="product__btn-plus">+</button>
      </div>
    )
  }
}

ReactDOM.render(
  <React.StrictMode>
    <App />
    <Card />
  </React.StrictMode>,
  document.getElementById('root')
);

Я попытался прописать две функции less() и more() и навесить их вызов на события onClick соответствующих кнопок, но у меня никак не получается в функциях получить значение, введенное в поле input и увеличить/уменьшить его... В каком направлении хоть копать? Подскажите, пожалуйста. Спасибо!


Ответы (0 шт):