Reaction-redux-toastr: текстовый ввод размыт, когда появляется тост - PullRequest
1 голос
/ 24 июня 2019

Я использовал библиотеку реаги-редукс-тостр для нашего проекта.Эта библиотека прекрасно работает, за исключением этого случая: codesandbox :

import React from "react";
import { useCallback } from "react";
import debounce from "lodash/debounce";
import { toastr } from "react-redux-toastr";

export default function Input({ value, onChange }) {
  const toast = useCallback(
    debounce(() => {
      toastr.error("Interupt your typing", "Sorry, I blur your text input");
    }, 500)
  );

  const setValue = e => {
    onChange(e.target.value);
    toast();
  };

  return (
    <input
      style={{ width: 500 }}
      type="text"
      value={value}
      onChange={setValue}
    />
  );
}

По сути, мы хотим, чтобы пользователь продолжал вводить данные, и неуверенно вызывал некоторый API для обновления ввода в базу данных.Все, что вызов API успешно, покажите тост.Однако всякий раз, когда отображается тост, ввод текста не сфокусирован.

в демоверсии CodeSandbox , вы можете попробовать набрать что-нибудь и посмотреть, в чем проблема.

Спасибо.

...