从父级到子级反应事件委托

Question

我Link在 an 中有一个 Gatsby元素<li>，我希望在用光标单击或用键点击时Link触发该元素。<li>enter

export default class Search extends Component {

    ...Constructor...

    render() {

        ...DOM elements...

        <input type="text" value={this.state.query} onChange={this.search} placeholder={'Search'} />

        {this.state.results.map((page, index) => (

            <li tabIndex={index} key={page.id} >

               <Link to={"/" + page.path}>{page.title}</Link>

            </li>

        ))}

        ...DOM elements...

    }

    ...More functions...

}

上面的代码在一个render块中，它在一个扩展的类中Component。

我试着添加onClickHandler到<li>，但不知道任何物体的我可以传递给它包含到其子的参考...

我需要将事件委托给孩子的主要原因是因为tabIndex（从其input上方的元素接收焦点）仅适用于<li>，因此一旦获得<li>焦点，我希望用户能够按回车键并传播该事件到子<Link>元素（这是一个使用 Gatsby 内部路由的特殊链接元素）。