Question

redux的新增功能，使用Firebase构建一个React应用。

在组件中，我使用firestoreConnect（）来侦听列表集合并按类别对其进行过滤。问题是当我切换到其他组件时，我可以将旧列表数据保留1秒钟，直到有新列表数据出现为止。

检查了redux dev工具，在卸载组件时未清除列表状态，这就是为什么在安装新组件时仍可以看到旧数据的原因。

如何在卸载组件时清除列表状态？使用firestoreReducer，我无法将明确的状态操作分配给reducer。

列表组件：

import React from 'react'
import { compose } from "redux";
import { connect } from "react-redux";
import { firestoreConnect } from "react-redux-firebase";

function List({ data }) {

    return (
        data ? <List
            dataSource={data}
            renderItem={item => (
                < Item />
            )}
        /> : <p>Loading...</p>
    )
}

const mapStateToProps = (state) => {
    return {
        listData: state.firestore.ordered.listData,
    }
}

export default compose(
    connect(mapStateToProps),
    firestoreConnect((props) => {
        return [
            {
                collection: 'listData',
                where: [["category", "==", props.category]]
            },
        ]
    })
)(List)

减速器：

import authReducer from './authReducer'
import { combineReducers } from 'redux'
import { firebaseReducer } from "react-redux-firebase";
import { firestoreReducer } from "redux-firestore";

const rootReducer = combineReducers({
    auth: authReducer,
    firestore: firestoreReducer,
    firebase: firebaseReducer,
})
export default rootReducer

使用react-redux-firebase卸载组件时如何清除状态？

0 个答案: