Plural does not work with useState

[MOTORIST]

#248 🐛 Bug Report

When "count" changes, the translation does not change.

const Com = ()  => {
  const [hintValue, setHintValue] = useState(null);
  const { t } = useTranslation(null);

  const handleOnChange = (e) => {
    setHintValue(t('hint', {count: e.target.value}));
    console.log(t('hint', {count: e.target.value}));
  }

  return (
   <div>
     <div className="FormGroup">
      <input className="Input" type="number" onChange={handleOnChange} />
      <div className="FormGroup-Hint">{hintValue}</div>
    </div>

    <hr/>
      <div>1: {t('hint', {count: 1})}</div>
      <div>5: {t('hint', {count: 5})}</div>
   </div>
  );
}

To Reproduce

stackblitz.com

Your Environment

• i18next version: 19.4.4
• react-i18next version: 11.5.0

[MOTORIST]

My mistake (

setHintValue(t('hint', {count: +e.target.value}));