this.props.keyword || '' ，不太理解 || 的原因

来源：9-5 SearchHeader组件

horistardust

2017-12-06

class SearchHeader extends React.Component {
    constructor(props, context) {
    super(props, context);
    this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
}
render() {
    return (
    <div id="search-header" className="clear-fix">
    <span className="back-icon float-left" onClick={this.clickHandle.bind(this)}>
    <i className="icon-chevron-left"></i>
    </span>
    <div className="input-container">
    <i className="icon-search"></i>
    &nbsp;
    <SearchInput value={this.props.keyword || ''} enterHandle={this.enterHandle.bind(this)}/>
    </div>
    </div>
    )
}
clickHandle() {
    window.history.back()
}
enterHandle(value) {
    hashHistory.push('/search/all/' + encodeURIComponent(value))
}
}

老师的代码里写了 this.props.keyword || '' ，看起来是为了防止keyword不存在的情况，就是不知道keyword什么情况下会不存在。

keyword这个参数是来自于router组件吧，this.props.params拿到的，那么如果input里没有输入值就直接回车，通过this.props.params拿到的keyword这个键值对或许就不存在了，还是说是存在的，只是值变成了' '呢（我看父组件里又是直接传的params.keyword,又好像是存在的）？

要是存在，this.props.keyword || '' 的意义何在呢？还是说只是和bind(this)一样要养成习惯？

写回答

2回答