javascript - emergent react-autosuggest 列表中不监听 event click

Question

当我点击其中一个建议时，下拉列表只消失，但听不到鼠标点击事件，

鼠标焦点和键盘事件等其他事件完美运行。

在我的输入代码结构中，组件通常位于另一个组件内，如下面的部分代码所示:

父组件

class SideMenu extends React.Component {
  constructor(props){
    super(props);
    this.state={
      nameSideMenu: "",
    }
  }
  changeName=(value)=>{
    const h=new Side();
    this.setState({nameSideMenu: value})
    this.props.value_return(value);
    h.setState({name: value})
  }

  render(){
    return(
      <div id="sidebar_menu">
      <h1>Search</h1>
       <CajaTxt value={this.changeName}/>
      </div>
    )
  }
}

子组件，在 CajaTxt 类的渲染中

return(<form>
         <Autosuggest
          id="Name" 
          suggestions={nicknameSuggestions}
          onSuggestionsFetchRequested={this.onNicknameSuggestionsFetchRequested}
          onSuggestionsClearRequested={this.onNicknameSuggestionsClearRequested}
          onSuggestionSelected={this.onNicknameSuggestionSelected}
          getSuggestionValue={getSuggestionNickname}
          renderSuggestion={renderSuggestion}
          inputProps={nicknameInputProps}
        />
</form>)

请帮帮我，我已经站了很长时间试图纠正那个错误

Answer 1

使用 Prop focusInputOnSuggestionClick

https://github.com/moroshko/react-autosuggest#focus-input-on-suggestion-click-prop

它提供了在单击建议后失去输入焦点的能力。