我有一个使用默认道具的React组件：

class MyComponent extends Component {
  constructor(props) {
    console.log('props', props);
    super(props);

// rest of code here

}

MyComponent .defaultProps = {
  __TYPE: 'MyDateRange',
};

当我使用该组件时,没有传递任何道具,道具的控制台日志会显示默认道具,就像应该的那样.

现在,当我想传递一个额外的道具(在这种情况下为函数)时,如下所示：

<MyComponent onEnterKey={() => console.log('snuh')}/>

道具的控制台日志仅显示onEnterKey函数.

我该怎么做才能允许MyComponent使用默认道具并接受函数？我尝试向MyComponent的构造函数添加另一个参数,但这不起作用.

解决方法:

我试过了,这正在工作：

import React from "react";
import { render } from "react-dom";

class MyComponent extends React.Component {
  constructor(props) {
    console.log("props", props);
    super(props);
  }

  render() {
    return null;
  }
}

MyComponent.defaultProps = {
  __TYPE: "MyDateRange"
};

render(
  <MyComponent onEnterKey={() => console.log("snuh")} />,
  document.getElementById("app")
);

您可以在这里看到它：https://codesandbox.io/s/wkw0k0j5o8