Redux存储区中的prop更改时，未更新反应DOM

Question

这让我快要疯了几个小时……我有一个模块，显示一个从服务器获取并在按下按钮时加载到redux存储中的列表。那工作正常。我提到这是因为这是为什么我不了解以下行为的原因。

此商店中的对象数组通过以下方式映射到我的组件中]

const mapStateToProps = (state) => {
    return {
        extracted_templates: state.extracted_templates
    }
}
并在render()中使用，如下所示...为了简化起见，我删除了其他一些DOM部分

render(){
    return(
        <div className="main-container">
            {Object.values(this.props.extracted_templates).length > 0 ?
                <ExtractedTemplatesList templates={Object.entries(this.props.extracted_templates)} clickHandler={this.clickHandler} /> : '' }
        </div>
    );
}
clickHandler使用与访存功能相同的操作来修改存储。

clickHandler(action, id, parent){
    console.log(action+" "+parent)
    switch(action){
        case 'dismiss':
            let new_template_list = this.props.extracted_templates
            delete new_template_list[id]
            // console.log(new_template_list)
            this.props.dispatch(setExtractedTemplates(new_template_list))
            break;
        default: 
            break;
    }
}
一切都正确调用，商店更新

正确（正如我在Web开发控制台中看到的那样），但是这次DOM没有更新。为了完整起见，这是操作和Reducer的实现

动作：

export const setExtractedTemplates = (templates) => ({
    type: actions.SET_EXTRACTED_TEMPLATES,
    payload: templates
    });
减速器：

case actions.SET_EXTRACTED_TEMPLATES:
    console.log({action})
    return {
        ...state, 
        extracted_templates: action.payload
}
    

这让我快要疯了几个小时……我有一个模块，显示一个从服务器获取并在按下按钮时加载到redux存储中的列表。那工作正常。我将此称为...

Answer 1

尝试一下：

Answer 2

您要对现有数据进行变异，和