ReactJS组件PropTypes - 指定具有设定数量参数的函数类型

dan*_*ami 10 javascript reactjs

我在react(版本0.13.3)组件中指定了一个必需的函数proptype ...

var MyComponent = React.createClass({
    propTypes : {
        onClick : React.PropTypes.func.isRequired
    },

    handleClick(event) {
        this.props.onClick(event, clickCallback);
    },

    clickCallback() {
        console.log("foo");
    },

    render() {
        return <div onClick={this.handleClick}></div>
    }
});

export default MyComponent;
Run Code Online (Sandbox Code Playgroud)

正如您所看到的,我的onClick prop不仅需要是一个函数,还需要接受2个参数.有没有办法使用React PropTypes来指定它?

我已经阅读了关于可重用组件React docs条目,似乎只有一种方法来定义对象类型的形状而不是函数类型.

edo*_*lin 7

您可以尝试使用自定义验证器:

propTypes : {
    onClick : function(props, propName, componentName) {
        var fn = props[propName];
        if(!fn.prototype ||
           (typeof fn.prototype.constructor !== 'function' &&
            fn.prototype.constructor.length !== 2)) {
            return new Error(propName + 'must be a function with 2 args');
        }
    }
}
Run Code Online (Sandbox Code Playgroud)