Redux + React + FireBase：更新时如何使用状态

Question

你好男女生：）

我开始使用Firebase＆amp;＆amp; Redux和我在回调中遇到了一些问题on - firebase.database().ref()在公式中的功能

function getAll() {

    const uid = JSON.parse(localStorage.getItem('user'))
        .uid;


    const dbRef = firebase.database()
        .ref().child('events');

    const userRef = dbRef.child(uid);

    let answer = [];

    userRef.on('value', snap => {
        let rx = snap.val();
        for (let item in snap.val()) {
            answer.push(rx[ item ]);
        }
    });

    return Promise.resolve({
        events: answer
    });
}

我在做什么？

我之前创建了一些操作（触发器）来调用此服务，并且必须在使用store中的reducer保存结果之前触发此方法。

这是预期的。 但的，...

我的实际情况是什么？

• 该方法及时触发，新的好:-) 但是，
• callback（原样）在1或1.5s之后几秒钟触发，而redux本身，非常快的单位，会触发并进行反应渲染同时。简而言之，在firebase回调返回值之前，组件会被渲染。

在决赛中，我需要渲染，重新加载页面，更改为应用程序的另一个路径，以便保存的更改可以应用于渲染。

由于我从 redux 和 firebase 开始，我不是100%（但只有70%）确定此扣除，但他们是我在这种情况下可以找到的更好的。

那是什么情况？

我现在正在寻求任何帮助，感谢您提供给我的任何帮助：）

Answer 1

嘿伙计我今年1月开始使用Firebase完成了整个项目，我知道找到信息的困难。

你的问题的答案是你需要使用传奇。

https://github.com/redux-saga/redux-saga

Sagas是一种同步API调用的方法，因此在reducer调度操作之前调用它们，并且可以控制同步API调用。

例如，

function* addAnswer{
    const user = yield call(Api.addAnswer, action.payload.userId); 
    yield put({type: "REQUEST_USER_ANSWER_SUCCEEDED", user: user});
}

在继续之前，Sagas将等待收益结束。然后将此函数绑定到操作。

function* mySaga() {
    yield takeEvery("REQUEST_USER_ANSWER", fetchUser);
}

然后你向你的商店添加了redux-saga中间件

const sagaMiddleware = createSagaMiddleware() // mount it on the Store const store = createStore( reducer, applyMiddleware(sagaMiddleware) )

基本上，这里发生的是每次你回答你想要绑定到传奇动作REQUEST_USER_ANSWER然后如果成功触发你想要你的减速器绑定的REQUEST_USER_ANSWER_SUCCEEDED。这样，只有在API调用完成并成功时，才知道reducer触发器。

人们要么在他们提供同样工作的项目中使用Saga或Thunk，但你绝对需要其中一种。