Ich kämpfe immer noch mit Drizzle und versuche, meine eigene Aktion zu steuern. Basierend auf der Drizzle-Box habe ich Folgendes zu HomeContainer hinzugefügt:
import Home from './Home';
import {drizzleConnect} from 'drizzle-react';
import * as actions from '../../store/actions/actions';
// May still need this even with data function to refresh component on updates for this contract.
const mapStateToProps = state => {
return {
accounts: state.accounts,
SimpleStorage: state.contracts.SimpleStorage,
TutorialToken: state.contracts.TutorialToken,
Series: state.contracts.Series,
drizzleStatus: state.drizzleStatus,
rates: state.rates.ethRate
}
};
const mapDispatchToProps = dispatch => {
return {
onGetEthRate: (fiatSymbol) => {console.log(dispatch); dispatch(actions.getEthRate(fiatSymbol));}
};
};
const HomeContainer = drizzleConnect(Home, mapStateToProps, mapDispatchToProps);
export default HomeContainer;
Der getEthRate-Aktionsersteller sieht folgendermaßen aus:
export const getEthRate = (fiatSymbol) => {
console.log("Getting ETH rate for " + fiatSymbol);
return {
type: actionTypes.GET_ETH_RATE,
fiatSymbol: fiatSymbol
};
};
Und dann habe ich eine Saga registriert, um diese Aktion in rootSaga.js zu verarbeiten:
export default function* root() {
yield all(
drizzleSagas.map(saga => fork(saga)),
takeEvery(actionTypes.GET_ETH_RATE, getEthRateSaga)
);
}
Aber die folgende Saga wird nie ausgelöst, da ich das Protokoll nie in der Konsole sehe:
export function* getEthRateSaga(action) {
console.log("Fetching ETH rate for " + action.fiatSymbol);
try {
const response = yield http.get('/price?fsym=ETH&tsyms=' + action.fiatSymbol);
const rate = response.data[action.fiatSymbol];
yield put(actions.updateEthRate(action.fiatSymbol, rate));
} catch(error) {
console.error(error);
}
}
Und basierend auf der Redux-Entwicklerkonsole wird die GET_ETH_RATE-Aktion nicht einmal gesendet, daher frage ich mich, ob mapDispatchToProps mit drizzleConnect funktioniert.
Okay, also ich habe es herausgefunden. Ich wurde von Redux DevTools in die Irre geführt, was mich denken ließ, dass die Aktion nicht gesendet wurde, weil ich beim Filtern nach dem Namen der Aktion nichts gesehen habe. Aber anscheinend wurde die Aktion abgeschickt, aber nicht von Saga abgeholt, weil dort ein Fehler in meiner Initialisierung war:
export default function* root() {
yield all(
drizzleSagas.map(saga => fork(saga)),
takeEvery(actionTypes.GET_ETH_RATE, getEthRateSaga)
);
}
Das Problem ist, dass all() ein Array erwartet und ich ihm ein Array und ein isoliertes Objekt übergebe. Hier ist die richtige Syntax, um das zu beheben und mein takeEvery an das Ergebnis von drizzleSagas.map() anzuhängen:
export default function* root() {
yield all([
...drizzleSagas.map(saga => fork(saga)),
takeEvery(actionTypes.GET_ETH_RATE, getEthRateSaga)
]);
}
Damit funktioniert alles bestens.
Ihre Connect-Implementierung ist in Ordnung. Drizzle akzeptiert mapDispatchToProps so, wie Sie es hier implementiert haben. (Siehe die Quelle hier , falls interessiert.) Für mich sieht es so aus, als hätten Sie einen einfachen Importfehler. Sie exportieren den Aktionsersteller direkt ( export const getEthRate), verweisen aber als actions.getEthRate. Das würde mit dem Verhalten übereinstimmen, das Sie sehen, wenn die Aktion nie ausgelöst wird, da actions.getEthRatesie undefiniert wäre.
Sebastian