Реагируйте - используйте Reducer и используйте State

Question

Я начал применять шаблон редуктора в новом проекте, и я хочу знать, имеет ли хук useReducer ту же проблему с async immutability, что и хук useState.

Что я имею в виду:

const [state, setState] = useState('');

const handleChange = e => {

 setState(e.target.value);

 // It doesn't give the current value, it gives the previous one, which is ''
 console.log(state);

 // So i need to set the current value in a variable to avoid the async immutability
 const currentValue = e.target.value;

 console.log(currentValue);

 e.stopPropagation();
}

<input type='text' value={state} onChange={handleChange}>PRESS</button>

Для хука useReducer мне нужно сделать то же самое: установить текущий change в variable?

Answer 1

ПРОБЛЕМА РЕШЕНА

Чтобы избежать неизменности хука useReducer, нам нужно установить current value в variable. И затем получить доступ к этой переменной.

const initialState = {
 value: ''
};

const [state, dispatch] = useReducer(SomeReducerFunction, initialState);

const handleChange = e => {

 dispatch({type: SOME_ACTION_TYPE, payload: e.target.value });

 const currentValue = e.target.value;

 console.log(currentValue);

 e.stopPropagation();
}

<input type='text' value={state} onChange={handleChange}>PRESS</button>

Answer 2

Неважно, что вы используете useState или useReducer, вы увидите обновленные значения в следующем цикле рендеринга.

Это не недостаток, а дизайн. Если вы хотите что-то сделать с обновленным значением, используйте useEffect, который запускается после каждого рендера.

Таким образом, он будет иметь значение fre sh с ним.