检查方法ReactJS无状态的组件中存在

如果发现自己不断射击该道具的方法：检查方法ReactJS无状态的组件中存在

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) :()=>{} }>

或许有一个somekind的的propType符合默认值的东西可以把未填充作废匿名函数所有传入的方法呢？

UPDATE：

对于没有参数的方法，如在注释部分提到的，这是有效的，即使没有给出：

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

作为ReactJS节选的onClick = {NULL}

来源

2017-07-18 Guy

你可以做'props.menuClick || （）=> {}'而不是？： – T4rk1n

我很确定'onClick = {null}'在React中有效，并且在点击时不会抛出错误？ –

也是第三个例子，如果参数与你调用的函数相同，你不需要包装它们，它们会被正确地传递。 – T4rk1n

您可以通过ES6类定义您的功能，默认道具包含您的默认空功能：

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

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

来源

2017-07-18 01:16:18

检查方法ReactJS无状态的组件中存在

回答

相关问题