Wydaje mi się, że trochę mylisz pojęcia..., bo funkcja incrementAsync()
zwraca jedynie callback z jednym parametrem, który może nazywać się dowolnie i w każdym przypadku zadziała to identycznie
const runCallback = (callback) => callback((value) => console.log(value));
function incrementAsync() {
return dispatch => {
dispatch({ name: 'dispatch' });
}
}
function incrementAsync2() {
return alaMaKota => {
alaMaKota({ name: 'alaMaKota' });
}
}
function incrementAsync3() {
return aKotMaAle => {
aKotMaAle({ name: 'aKotMaAle' });
}
}
runCallback(incrementAsync()); // console.log({ name: 'dispatch' })
runCallback(incrementAsync2()); // console.log({ name: 'alaMaKota' })
runCallback(incrementAsync3()); // console.log({ name: 'aKotMaAle' })
W Reduxie, działa to dokładnie tak samo, tylko zamiast wyświetlać tekst w konsoli zostaje zaktualizowany stan reducera dzięki funkcjom connect()
, mapStateToProps()
, mapDispatchToProps()
.
https://react-redux.js.org/api/connect
const MyComponent = ({ incrementAsync, incrementAsync2, incrementAsync3 }) => {
//
}
const mapStateToProps = (...) => {
// ...
}
const mapDispatchToProps = (dispatch) => {
return {
incrementAsync: () => dispatch(incrementAsync()),
incrementAsync2: () => dispatch(incrementAsync2()),
incrementAsync3: () => dispatch(incrementAsync3()),
}
}
// Funkcja connect wywołuje funkcje mapStateToProps, oraz mapDispatchToProps
// i łączny wynik, który otrzyma wstawia do naszego komponentu jako propsy
export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);