Question

我有以下

const Range = field => {
  <Button
    className="btn btn-info plus_btn"
    onClick={() => {
      field.handleClick();
    }}
  />;
};

const component = (props: { dismiss: Function }) => {
  <Field
    name="Test"
    component={Range}
    props={props}
    label="Test"
    handleClick={() => console.log("Clicked!")}
  />;
};

const mapDispatchToProps = (dispatch: Function) => ({
  dismiss: () => {
    console.log("dismiss");
  }
});

当我按下按钮时，它给我的handleclick不是函数，我想将dismiss函数传递给handleclick函数，以便当我单击Range内的按钮时，它将在mapDispatchToProps中调用dismiss函数。

Answer 1

您只需要在Range组件中使用它

const length = data.listArts.items.length
data.listArts.items.map((art, index) => {
if(index === length -1) {
 /* invoke callback */
}
return (
  <a className="thumbnail" key={index}>
    <img src={art.ArtURL}/>
  </a>
);})

否则，如果要将handleClick函数传递给Range组件，则需要在reduxforms字段的props中传递它，如下所示：

const Range = field => {
  <Button
    className="btn btn-info plus_btn"
    onClick={() => {
      field.dismiss();
    }}
  />;
};

reactjs redux表单将Onclick函数传递给字段

1 个答案: