在使用DataV轮播组件时,遇到该问题,培训名称过长,Css自动省略为...,鼠标指向不展示全名称
这是DataV在组件封装时,没有对.cell的div增加title属性及美化
可以在赋值时进行内容定制话
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLiYTMfhHLlN3XnxCM38FdsYkRGZkRG9lcvx2bjxSNx8VZ6l2cs0zYU9kMNRVT3dmeNZmQUJWQClGVF5UMR9Fd4VGdsATNfd3bkFGazxycykFaKdkYzZUbapXNXlleSdVY2pESa9VZwlHdssmch1mclRXY39CXldWYtlWPzNXZj9mcw1ycz9WL49zZuBnL2kzN2QjNwATM0ETOwEjMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
简单实现就是:
<dv-scroll-board :config="gbxlconfig" />
.datav-cell {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
gbxlconfig: {
header: ["培训班名称", "参与人数", "时间", "范围"],
headerBGC: "#E44047", //表头颜色
oddRowBGC: "", //奇数行背景色
evenRowBGC: "#F5D5D4",
data: [],
headerHeight: "30",
columnWidth: [120],
align: ["center", "center", "center", "center"],
rowNum: 5,
},
dyjypxData: [
[
"<div class='datav-cell' title='党史学习教育专题学习班'>党史学习教育专题学习班</div>",
"57",
"2021-07-06",
"中层副职以上",
],
],