1

在我的应用程序中，我使用react-redux-firebaseversion2.5.1和redux-firestoreversion ^0.13.0。我呈现与客户的对话列表（称为线程），每次用户转到另一个线程时，直到它被加载，我希望他看到一个加载微调器。我的问题是，只有当我在应用程序部署后第一次进入线程时，微调器才会显示，之后每次我更改线程时，方法isLoaded总是正确的，即使我看到页面显示了几秒钟上一个线程。有没有人遇到过这样的事情，可以帮助我如何解决它？

这是我的组件

const mapStateToProps = (state, props) => {
    const customerId = props.match.params.id;
    return {
        thread: state.firestore.data.thread,
        ...
    };
};

export default compose(
    withStyles(styles),
    connect(mapStateToProps, mapDispatchToProps),
    firestoreConnect(props => [
        {
            collection: "thread",
            doc: props.customerId,
            storeAs: "thread"
        }
...
    ])
)(ThreadView);

这是我的渲染方法

       render() {
            const {firebase, thread} = this.props;            
            const res = !isLoaded(thread); // after the first load it's always false
            console.log(`customerId: ${customerId}, isLoaded: ${res}`)
            if (res) {
                return <LoadingSpinner/>;
            }
...
4

1 回答 1

1

我也遇到了这个问题，到目前为止还没有找到满意的解决方案。但是，我确实找到了解决方法：

编写一个自定义isLoaded函数来检查任何正在进行的请求：

const checkIsLoaded = function(firestore) {
    return !Object.values(firestore.status.requesting).find(isRequesting => isRequesting);
};

因为所有当前待处理请求的状态（真/假）都保存在 redux 存储中，所以firestore.status.requesting我们可以检查一下，看看当前是否有任何请求仍在加载！

这不是一个理想的解决方案，因为它会检查所有正在进行的请求，而不仅仅是您要检查的特定请求。但是，根据您的用例，这可能就足够了。

于 2021-04-18T06:57:03.887 回答