antd table 鼠标悬浮 显示内容 鼠标移开 隐藏内容

列渲染的时候给个className

 render: (text, record, index, onEdit) => (
              <div className='operation-col'>
                <span className="marginSpan" title="查看明细" onClick={(e) => this.viewDetail(e,text, record, index, onEdit, '2')}><i className="icon-coms-Detailed"></i></span>
                {this.store.resData.createtask && <span className="marginSpan" title="创建任务" onClick={(e) => this.createTask(e,text, record, index, onEdit, '1') }><Icon type="plus" /></span>}
                <span className="marginSpan" title="添加到工作计划" onClick={(e)=>{ e.stopPropagation();this.addToPlanList(record)}} ><i className="icon-coms-positive-sequence"></i></span>
              </div>
            )

css这么写

.operation-col{
      opacity: 0;
  }

  .ant-table-row:hover{
      .operation-col{
          opacity: 1;
      }
  }

效果：鼠标悬浮的时候显示，去掉就不显示