尽管使用connect和mapDispatchToProps,派遣操作仍未触发reducer

时间:2020-08-22 11:54:45

标签: reactjs redux react-redux

我在Icon中有一个PostItem.jsx,我已经向其中添加了onClickonClicking图标,它应该调度type: LIKE_POST的动作,

好吧,如果我在我的调度动作中console.log()正常工作,但是reducer.js可以识别此动作类型,并且我在控制台上看不到任何动作触发器(使用{{1 }}。

CodeSandbox

单击侧栏上的“帖子”图标,它将呈现帖子列表。第一个按钮类似于按钮,第二个按钮与左下角的按钮不同

这是我的代码段

redux logger

postAction.js

这是我的postActions.js

//PostItem.jsx

const handleLike = (index) => {
console.log(“Inside Like”);
likePost(index);
};

const PostItem = ({ index, key, style, post }) => {
return (

{console.log(“PostItem Rendering”)}
/*Some Extra Code*/}
  <Card.Content extra>
    <Icon
      circular
      onClick={() => handleLike(index)}
      link
      name="heart"
      className="mr-1 fs-icon-md"
      color="teal"
    ></Icon>
    <Icon
      circular
      onClick={() => handleDislike(index)}
      link
      name="heartbeat"
      className="mr-1 fs-icon-md"
    />
    <Icon circular link name="delete" className="mr-1  fs-icon-md" />
    <Icon circular link name="upload" className="fs-icon-md" />
  </Card.Content>
</Card>

);
};
const mapDispatchToProps = (dispatch) => ({
likePost: (index) => dispatch(likePost(index)),
dislikePost: (index) => dispatch(dislikePost(index))
});
export default connect(null, mapDispatchToProps)(PostItem);

这是我的postReducerr.js

// Action Creator

export const likePost = (postIndex) => {
  console.log('Indise Like Action');
  return {
    type: postTypes.LIKE_POST,
    payload: postIndex,
  };
};

1 个答案:

答案 0 :(得分:0)

好的,我忘了在组件中将likePostdislikePost添加为props