有些数据没有使用react-redux从容器组件传递到哑组件

Question

我有点磕碰，因为当你使用react-redux的连接api时，它会自动工作。但现在我面临的情况是，一些数据没有得到更新，当一些东西从减速机返回。

这是我的伪代码。

在reducer文件中我有…

case "SORT_BY_DATE":
    let startDateSort = state.startDateSort;
    let endDateSort = state.endDateSort;
    const sortByStartDateUp = function(a, b) {
        return new Date(a.start_date) > new Date(b.start_date) ? 1 :-1;
        }
    const sortByStartDateDown = function(a, b) {
        return new Date(b.start_date) > new Date(a.start_date) ? 1:-1;
        }
    const sortByEndDateUp = function(a, b) {
        return new Date(a.stop_date) > new Date(b.stop_date) ? 1 : -1;
        }
    const sortByEndDateDown = function(a, b) {
        return new Date(b.stop_date) > new Date(a.stop_date) ? 1 : -1;
        }
        let sortFunctionByDate = "";
    if (action.time == "start"){
        sortFunctionByDate = startDateSort == true ? sortByStartDateUp : sortByStartDateDown;
            startDateSort = !startDateSort;
    }else{
        sortFunctionByDate = endDateSort == true ? sortByEndDateUp : sortByEndDateDown;
        endDateSort = !endDateSort;
        }
    let filtered = state.status + "Banners";
        let banners_filtered =state['banners'].sort(sortFunctionByDate)
        state[filtered] = banners_filtered;
        state["banners"] = banners_filtered
        return Object.assign({}, state, {
            startDateSort,
            endDateSort,
            showImageButton: false,
        })

到这里为止，我还能断言我得到的信息是正确的。从banners_filtered变量。

这是我的容器组件:

 const mapStateToProps = (state) => {
let {liveBanners} = state.BannerReducer;
console.log("liveBanners", liveBanners)
return {
    liveBanners
}

}

const BannerTableList = connect(mapStateToProps,mapDispatchToProps(BannerTable)

----我可以在这里登录livebanner ..以及——但是这个值在哑组件中没有得到更新…就像我一直在做的其他变量一样…会不会是因为太多了?减速器内部的计算?我几乎不怀疑这就是原因。但如果你有任何预感，可能出了什么问题，请告诉我。此时此刻，我洗耳恭听。谢谢。

——控制台也没有显示错误————

const BannerTable = ({liveBanners}) => {
   console.log("banners", liveBanners)
}

上面的

是我的哑组件，使用无状态函数和livebanner从未登录到控制台。

Answer 1

你在这里改变你的当前状态对象:

state[filtered] = banners_filtered;
state["banners"] = banners_filtered
return Object.assign({}, state, {
    startDateSort,
    endDateSort,
    showImageButton: false,
})

这可以防止react-redux检测到更改，这将阻止预期的呈现。您可能只需要将其更改为:

return Object.assign({}, state, {
    [filtered]:banners_filtered,
    banners: banners_filtered,
    startDateSort,
    endDateSort,
    showImageButton: false,
})