为什么reactjs应用程序中的redux onclick操作无法正常工作？

Question

这里是简化代码：

-action.js

export const removeVisitedUser = id => async dispatch => {
        try  {
        const visited = JSON.parse(localStorage.getItem(`visited_`)) || [];
        const filtered = visited.filter(i => i !== id);
        debugger
        dispatch({type: REMOVE_VISITED_USER, payload: {filtered}})
    } catch (err) {
        dispatch({ type: ERROR_REMOVE_VISITED_USER }, err)
    }

}

export const errorRemoveVisitedUser = () => ({
    type: ERROR_REMOVE_VISITED_USER
});

-reducer.js

import { REMOVE_VISITED_USER } from "./action";


const initialState = {
    visited: JSON.parse(localStorage.getItem(`visited_`)) || [],
};

export default (state = initialState, action) => {
    const { visited } = state;
    const { type, payload } = action;

    switch (type) {
        case REMOVE_VISITED_USER: {
            return { ...state, visited: payload.filtered};

};

-reactComponent.js

const reactComponent= ({
    visited: { visited},
    removeVisitedUser,
}) => {
return (
        <div className="visited-list">
            <div className="visited-list__items">
                <MyLogo />
                {visited.map((i, ind) => (
                    <div
                        key={ind}
                        onClick={() => removeVisitedUser(i._id)}
                        className={`visited-list__item ${active(ind)}`}
                    >

                        {!i.img
                            ? <i className="fa fa-user-circle" />
                            : <div style={{ backgroundImage: `url(${avatarGetter(i.img)})` }} />}
                    </div>
                ))}
            </div>
        </div>
    );
};

您可以看到调试器正在删除操作，因为我知道当我单击任何访问的用户div时调试器应该运行，但是没有，所以操作也没有用。

我花了很多时间来了解它应该如何正常工作，但仍然没有弄清楚。

谢谢。

Answer 1

我看不到您在任何地方使用mapDispatchToProps。您可以提供此代码吗？或者，如果您没有它，则需要添加它，以便react知道将其用作道具]