檢查方法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無狀態的組件中存在

回答

相關問題