根据你提供的代码片段，似乎是一个表格组件中的自定义渲染函数。以下是我对你的代码进行了整理和补充完整的版本：
title: '产品名称',
key: 'productName',
width: 200,
customRender: ({ record }) => {
// 去重处理
const uniqueProducts = [
...new Set(record.workOrderLoans?.map((item) => item.productName))
];
// 生成tooltip内容
const tooltipContent = record.workOrderLoans
?.map((item) => `${item.productName}: ${item.loanInfoCode}`)
.join('\n');
return {
children: h(
"div",
{
style: {
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis',
cursor: 'pointer',
width: '200px'
},
title: tooltipContent // 设置tooltip内容
},
uniqueProducts.join('/') // 显示去重后的产品名称
)
};
}
解释：
- 去重处理：使用
Set来确保每个产品名称在uniqueProducts中是唯一的。 - 生成 Tooltip 内容：将
workOrderLoans数组中的每一项格式化为产品名称 : 借款信息代码的形式，并用换行符连接起来。 - 返回的组件：
- 创建一个包含样式的
<div>，并且设置title属性为之前生成的tooltipContent，以便鼠标悬停时能够显示详细信息。 - 最后，用
uniqueProducts.join('/')来显示去重后的产品名称。
- 创建一个包含样式的
请根据实际情况调整代码中的细节，如库导入等。希望这能帮到你！
内容由零声教学AI助手提供，问题来源于学员提问
