Reactjs 如何从React中的列表中获取所选项目？

我想得到所选的项目，我想知道哪个项目被选中或点击

我正在显示一个用户列表，如下所示：

<InfiniteScroll
    initialLoad={false}
    pageStart={0}
    loadMore={this.handleInfiniteOnLoad}
    hasMore={!this.state.loading && this.state.hasMore}
    useWindow={false}>
    <List 
        dataSource={this.state.data}
        renderItem={item => (
            <List.Item key={item}>
            <List.Item.Meta  
                avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" /> }
                  title={<a href="#">{item}</a>}/>                
            </List.Item>
        )}>
    </List>
</InfiniteScroll>

(
)}>

很容易做到，只需将onClick处理程序添加到renderItem部分

renderItem = {(item, index) => (
  <List.Item key={item} onClick={() => this.handleClick(index)}>
    <List.Item.Meta
      avatar={
        <Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
      }
      title={<a href="#">{item}</a>}
    />
  </List.Item>
)}

---

SelectedItem是您正在寻找的解决方案

上述解决方案应该可以工作。但只需确保将

onClick

事件附加到DOM元素即可。如果它是自定义组件，那么事件处理程序将无法工作。因此，在本例中，

List.Item

（我猜它是一个自定义组件）需要作为道具访问

onClick

，并将此事件附加到其最顶部的DOM元素，如下所示：

// List.Item

<li onClick={this.props.onClick} />

//List.Item

// List.Item

<li onClick={this.props.onClick} />