关于react事件改变状态的一些问题

Question

目前在写一个如下图效果的组件：

小白现在遇到两个问题：

当鼠标hover其中的一个列表时，弹出一条展示完整列表标题信息的tip，每一个列表都有一个对应的，那当我hover时怎么判定只显示当前列表的tip。

下面是我的部分代码：

  {

         this.props.list.map((item, index) => {

              return (

                 <li key={index} className="list" onMouseEnter={this.onMouseEnter.bind(this)} onMouseLeave={this.onMouseLeave.bind(this)}><a href={item.link} target="_blank">{item.listText}</a>

                     <div className="detail" style={{ display: this.state.open ? 'block' : 'none' }}>{item.listText}</div>

                 </li>

              );

         })

   }

Answer 1

你就用 open0 open1 等等去标记列表就可以，不用事先定义，只要hover时正负取反就行