gpt4 book ai didi

reactjs - PrimeReact 数据表 - 如何在单元格上显示工具提示或标题?

转载 作者:行者123 更新时间:2023-12-05 02:49:55 25 4
gpt4 key购买 nike

我正在使用 prime react 数据表 显示数据表,当鼠标悬停在单元格上时,我想显示工具提示或标题,如下图所示。

enter image description here

我检查了 Column 组件,但没有找到任何相关关键字来显示单元格上的工具提示或标题,这些单元格用于显示数据表中的列。

代码:

<DataTable
value={this.state.products3}
editMode="row"
dataKey="id"
onRowEditInit={this.onRowEditInit}
onRowEditCancel={this.onRowEditCancel}
>
<Column field="code" header="Code" editor={(props) => this.codeEditor('products3', props)}></Column>
<Column rowEditor headerStyle={{ width: '7rem' }} bodyStyle={{ textAlign: 'center' }} title='Edit'></Column>
</DataTable>

来源:https://primefaces.org/primereact/showcase/#/datatable/edit

我们将不胜感激!

最佳答案

解决此问题的一种方法是为您的列使用自定义正文。像这样:

<Column body={() => <Button icon="pi pi-pencil" className="p-button-rounded p-button-text" tooltip="Here's the tooltip!" />} headerStyle={{ width: '7rem' }} bodyStyle={{ textAlign: 'center' }} title="Edit"></Column>

tooltip on button

不幸的是,我无法在还设置了 rowEditor 属性的情况下使它正常工作,如您的示例所示。

关于reactjs - PrimeReact 数据表 - 如何在单元格上显示工具提示或标题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63849497/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com