el-table input textarea 文本域 自适应高度,切换分页滚动失效处理办法

场景: el-table 表格 需要 input类型是 textarea 高度是自适应,第一页数据都是单行数据 不会产生滚动条,但是第二页数据是多行数据 会产生滚动条,

bug: 第一页切换到第二页 第二页滚动条无法展示

解决办法:直接修改样式 加上overflow-y:auto 样式 完美解决

javascript 复制代码
this.$nextTick(() => {
	const table = this.$refs.tableRef.$el;
	const bodyWrapper = table.querySelector(".el-table__body-wrapper");
	if (bodyWrapper) {
		// 直接修改内联样式
	    bodyWrapper.style.overflowY = "auto";
	}
});

或者直接使用css

css 复制代码
::v-deep .el-table__body-wrapper {
	overflow-y: auto ;
}
相关推荐
叶落阁主6 分钟前
Neovim 插件 i18n.nvim 介绍
java·vue.js·vim
叫我詹躲躲7 分钟前
开发提速?Vue3模板隐藏技巧来了
前端·vue.js·ai编程
华仔啊7 分钟前
面试都被问懵了?CSS 的 flex:1 和 flex:auto 真不是一回事!90%的人都搞错了
前端·javascript
前端康师傅9 分钟前
JavaScript 函数详解
前端·javascript
葡萄城技术团队13 分钟前
从基础到实战:一文吃透 JS Tuples 与 Records 的所有核心用法
javascript
@小红花1 小时前
从0到1学习Vue框架Day03
前端·javascript·vue.js·学习·ecmascript
前端与小赵1 小时前
vue3中 ref() 和 reactive() 的区别
前端·javascript·vue.js
魔云连洲1 小时前
Vue的响应式底层原理:Proxy vs defineProperty
前端·javascript·vue.js
Hilaku2 小时前
深入URL和URLSearchParams:别再用正则表达式去折磨URL了
前端·javascript·代码规范
weixin_456904272 小时前
Vue.jsmain.js/request.js/user.js/store/index.js Vuex状态管理项目核心模块深度解析
前端·javascript·vue.js