Kuidas veel saab Reactis staatust uuendada (funktsiooni abil eelneva väärtusega)?

Reactis kasutatakse sageli setState või useState hooki funktsiooni, et uuendada olekut, võttes arvesse eelnevat väärtust.

Lisaks klassikalisele variandile:

setState(prevState => ({ count: prevState.count + 1 }));

on ka teisi uuendamise viise, näiteks:

• Funktsionaalsete komponentide kasutamine useState hookiga uuendamise funktsiooniga:

const [count, setCount] = useState(0);

setCount(prevCount => prevCount + 1);

• useReducer-is saab olekut uuendada redutseeri kaudu, mis saab praeguse oleku ja tegevuse:

function reducer(state, action) {
  switch(action.type) {
    case 'increment':
      return { count: state.count + 1 };
    default:
      return state;
  }
}

const [state, dispatch] = useReducer(reducer, { count: 0 });
dispatch({ type: 'increment' });

• Klassides saab kasutada setState tagasikutsumist, et pääseda ligi eelnevale olekule:

this.setState((prevState) => ({ count: prevState.count + 1 }));

Seega on funktsiooni kasutamine eelneva väärtusega standardne ja soovitatav meetod, eriti kui uus olek sõltub vanast, et vältida asünkroonsete uuenduste probleeme.