type
status
date
slug
summary
tags
category
icon
password
js
客户的需求推动技术的进步。最近做了个表格的一键打印，结果遇到表格内换行的时候，打印会碰到一格分成了两页的情况。
📝 方案
百度了一圈找不到方案，于是乎谷歌了一下，查技术资料这方面还是谷歌好用。
这段代码可防止在一个tr内分成2页
🤗 延伸
打印的时候发现，el-table并不能每页都显示表头，这样不大美观。查看代码后发现，el-table的表头和表体是分别用el-table__header-wrapper和el-table__body-wrapper包裹的，这导致el-table__body-wrapper内的表格并没有表头.那么解决方案就很明确了，把表头的内容搬到el-table__body-wrapper的表格里就行。
在el-table上，加上ref="myTable"
这里需要注意一下，由于vue采用的是虚拟dom，所以，想获取节点需要些在nextTick里面。
然后加上对应的CSS，把原来的表头隐藏掉
- 作者:吕行者
- 链接:https://www.lvy.life/article/2022/09/07/15f1f2f0-5182-80db-b863-fba4780de32e
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。
![[CSS]超出N行时，截取并显示省略号](https://op.hhfate.cn/notion/%E5%8D%83%E5%BA%93%E7%BD%91_%E7%A8%8B%E5%BA%8F%E8%AE%BE%E8%AE%A1%E4%BB%A3%E7%A0%81%E8%BD%AF%E4%BB%B6%E5%BC%80%E5%8F%91%E6%8A%BD%E8%B1%A1%E6%8A%80%E6%9C%AF%E8%83%8C%E6%99%AF2_%E8%83%8C%E6%99%AF%E7%BC%96%E5%8F%B76474246.jpg?t=1761f2f0-5182-80ca-9b17-d1d3ebbd8af5)
