Notification 消息过多太长 希望能折叠

如图下效果

• element-plus 可以将dom 插入到具体的元素 结合css :nth-child 来控制样式达到效果

element dom 只能插入到body中 所以无法使用:nth-child
1.Notification需要消息提示时设置class

let eleNum = 0 // 弹窗的序号
function notificationDialog(val) {
//弹窗关闭后 重制if (document.getElementsByClassName('zl-message-omp').length === 0) {eleNum = 0}eleNum = eleNum + 1Notification({title: '',dangerouslyUseHTMLString: true,customClass: `zl-message-omp-${eleNum} zl-message-omp`,duration: 3000,message: 1111})
}notificationDialog()
notificationDialog()
notificationDialog()
notificationDialog()
notificationDialog()
notificationDialog()

2。使用scss

超过3个折叠
@for $i from 4 through 100{$space:10px;  //折叠的高度$base:254px;	//这个值是第三个dom的top值.zl-message-omp-#{$i}{top: ($i - 3) * $space + $base !important;}
}

效果