Как при нажатии на кнопку уменьшить число символов в input на 1?

Question

[mosikus]

Здравствуйте. Есть код. Подскажите, как стирать один символ в input'е при нажатии на кнопку remove ?

Answer 1

[camelCaseVlad]

Можете попробывать следующее:

removeLast = () => {
    this.setState({ value: this.state.value.substring(0, this.state.value.length - 1)})
  };

и передать в последнюю кнопку <button onClick={this.removeLast}>remove</button>

Answer 2

[Дмитрий Карпов]

Предыдущее состояние State надо изменять через коллбек

deleted = () => {
    this.setState(({value}) => {
      const str = value.slice(0, -1);
      return {
        value: str
      }
    });
  };

button onClick={this.deleted}>remove</button>

Comments

[Алексей]

Вы вообще понимаете для чего колбек в setState нужен?

[Дмитрий Карпов]

Алексей, и что не так?
Вычислить следующее состояние компонента на основе предыдущего.

[Алексей]

То, что вы написали нужно только, если у вас выполняется несколько функций одновременно, которые обновляют стейт и зависят от текущего стейта, т.е. чтобы получить новое состояние до перерендера компонента, иначе вы получите неверное значение стейта, т.к. setState выполняется асинхронно. Здесь же при нажатии кнопки remove одновременно выполняется функция обновляющая стейт только один раз, поэтому смысла никакого в такой "оптимизации" нет, тем более в обработчиках событий, таких как click, пакетное обновление и сейчас работает по-умолчанию. И, кстати, то, что вы называете колбэком, на самом деле тотже первый аргумент в setState, только функция, а не объект, callback же идет вторым аргументом.
Кстати, с 17 версии реакта (по словам Абрамова) будет пакетное обновление стейта по дефолту вообще везде, а не только в обработчиках событий.

[Дмитрий Карпов]

Алексей, Ясно, спасибо.
Недавно начал изучать, значит не верно подаётся информация по которой изучаю)