javascript - 检查 ReactJS 无状态组件中是否存在方法

Question

如果发现自己不断发射该 Prop 的方法:

 const Menu = (props) => <div style={styles.container}
                    onClick={(ev) => props.menuClick(ev, props.item)}>...</div>

但这些方法有时是可选的。如何仅在方法存在时触发该方法？

这似乎不可读:

 const Menu = (props) => <div style={styles.container}
    onClick={(ev) => props.menuClick ? props.menuClick(props.item_id, ev) : ()=>{} }>

也许有某种 propType 满足默认值的东西可以将所有未填充的传入方法转换为无效匿名函数？

更新:

对于没有参数的方法，如评论部分所述，即使不给也是有效的:

const Menu = (props) => <div style={styles.container}
                    onClick={props.menuClick}>...</div>

作为 ReactJS 除了 onClick={null}

Answer 1

您可以使用包含默认空函数的默认属性通过 ES6 类定义您的函数:

class Menu extends Component {
 static defaultProps = {
  onClick: () => {}
 }

 render() {
  return(<div style={styles.container} onClick={this.props.onClick}></div>);
 }
}