Question

我得到警告，我的渲染函数的第一行为列分配了一个值，但从未使用过。

动作触发，但有效载荷持有不正确的对象。

import React from "react";
import { addCard } from "../../actions/card-actions";
import { connect } from "react-redux";

class Column extends React.Component {
    render() {
        const column = this.props.column;
        return (
            <AddCardLink onClick={column => {this.props.addCard(column)}}>
                Add new card...
            </AddCardLink>
        )
    }
}

const mapStateToProps = state => {
    return {};
};

const mapDispatchToProps = dispatch => {
    return {
        addCard: column => dispatch(addCard(column))
    };
};

export default connect(
    mapStateToProps,
    mapDispatchToProps
)(Column);

我的减速器；

const cardReducer = (state = initialState, action) => {
  switch (action.type) {
    case "CARD_DRAG":
      return onDragEnd(state, action.payload);
    case "CARD_ADD":
      console.log("action fired", action.payload);
      return {
        ...state,
        editing: true
      };
    default:
      return state;
  }
};

Answer 1

通过执行onClick={column => this.props.addCard(column) }，您没有使用先前定义的const列，只是期望有一个称为column的参数。试试这个：

onClick={ ()=> this.props.addCard(column)}

通过这种方式，您只是使用匿名函数来包装addCard，这样它就不会在组件加载后立即执行

如何分配将参数作为onClick属性的redux操作？

1 个答案: