我们一直在使用mat-table
实现网格,并且每个单元格都有一个mat-tooltip
。据我所知,即使用户将鼠标悬停在它上面,每个单元的工具提示渲染也是如此。请参阅示例代码以了解工具提示的用法。
<ng-container matColumnDef="carrier">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="clm-carrier">Carrier</th>
<td mat-cell *matCellDef="let element" matTooltip="{{element.carrier}}" class="clm-carrier">{{element.carrier}}</td>
</ng-container>
我发现某个地方的提示可能会影响您的性能(如果数量很多)。我们在3个不同的表中大约有500行,每个表中至少有5列。因此几乎可以随时渲染500 * 5 * 5 * 5 = 62500
个最大值,这可能会在生产中产生开销。
这真的有问题吗?材质角度在渲染方面是否有所不同?即使使用mat-tooltip,渲染大量工具提示是否可行?可以做些什么来改善这一点?
答案 0 :(得分:0)
确定62500 mat-tooltip
渲染可能会影响性能。也许考虑对您的桌子实施分页?
答案 1 :(得分:0)
您可以尝试使用简单的html title属性来显示工具提示,以显示要渲染的大量工具提示。
使用
sales cumulative
tehran 800 800
shiraz 200 1000
ghom 200 400
markazi 300 500
代替
tehran 800 800
shiraz 200 1000
ghom 200 1000
markazi 300 500
答案 2 :(得分:0)