Блог

Функции

В моей программе состояния не меняются

Код Функции Для Валидации

     const checkPassword = (e) => {
    const password = e.target.value;
    Capital(password);
    Small(password);
    Numbers(password);
    Symbols(password);
    MinLen(password);
    console.log(ErrStatus.capital);
  };
 

здесь я перечислил все переменные
Который используется

   const capital = new RegExp("[A-Z]");
  const small = new RegExp("[a-z]");
  const number = new RegExp("[0-9]");
  const symbols = new RegExp("[@$!%#?amp;]");
  const minLen = new RegExp("[A-Za-zd@$!%*#?amp;]{8,}$");

  const ErrArr = {
    capital: "One capital Letter required",
    small: "One small Letter required",
    number: "One number Letter required",
    symbol: "One symbol  required",
    minLen: "min 8 character required",
  };
  const [ErrStatus, setErrStatus] = useState({
    capital: true,
    small: true,
    number: true,
    symbol: true,
    minLen: true,
  });
 

Обратитесь к изображению для всех функций
В моем коде «ErrStatus» не обновляется из моей функции (которая присутствует на изображении)

Разделить государство на отдельные

   const [caps, setCaps] = useState(true);
  const [small, setSmall] = useState(true);
  const [number, setNumber] = useState(true);
  const [symbol, setSymbol] = useState(true);
  const [minLength, setMinLen] = useState(true);
 

Это сработало

Ваша проблема, вероятно, связана с асинхронными функциями javascript. Следующая проверка должна выполняться только после завершения предыдущей.

Поэтому ваш код должен выглядеть примерно так:

 async function Capital(password){
  ...
  await setErrStatus({...ErrStatus, capital: false})
}
async function Small(password){
  ...
  await setErrStatus({...ErrStatus, small: false})
}
async function Numbers(password){
  ...
  await setErrStatus({...ErrStatus, numbers: false})
}
async function Symbols(password){
  ...
  await setErrStatus({...ErrStatus, symbols: false})
}
async function MinLen(password){
  ...
  await setErrStatus({...ErrStatus, minLen: false})
}

 

Так что вы можете называть их так:

 const checkPassword = async (e) => {
  const password = e.target.value;
  await Capital(password);
  await Small(password);
  await Numbers(password);
  await Symbols(password);
  await MinLen(password);
  console.log(ErrStatus.capital);
};