解决办法如下: //在子组件挂载完成后,采用定时器延缓计算表格高度mounted() {/** 计算表格高度 * 使用定时器来计算表格高度,避免展开/收起查询条件时表格高度不更新*/let timer; clearInterval(timer); setInterval(()=>{this.$nextTick(() =>{this.tableHeight =this.tbHeight - 0;//计算表格高度}); }...
遇到这个问题的原因,估计是我外部包裹的div没有设置固定高度,而不设置固定高度的原因还是在于想适配不同大小的浏览器。所以使用calc(100% - 300px)无效,然后尝试了下面使用vh的写法: <el-table :data="tableData" max-height="calc(100vh - 300px)" style="width: 100%"> ... ... </el-table> 诶,...
直接使用el-table的height属性,可以传一个高度给它,就会以这个高度固定表格,内部数据滚动~ 但是我想屏幕大小table自适应高度,天真的输入80%, 发现不生效!这就需要人为操作如下: <template> <lls-table :data="tableData":height="tableHeight"> </llst-bale> </template>exportdefault{ data () {return{ tabl...
可以先重置一下高度,在动态获取浏览器高度resetHeight() { return new Promise((resolve, rehect) => { this.tableHeight = 0; resolve() })}fetTableHeight() { this.resetHeight.then(res => { this.tableHeight = this.$refs.tableWrapper.getBoundingClientRect.height });}tableWrapper是你表格所在...
明显是初始化的时候某个对象是null导致的。 查看源码 查看源码我们能看到这里有判断this.maxHeight是否为空,也就是我们是否有设置。有设置的话,会返回一个对象,其中会调用this.data.length。问题就是这里。初始化时this.data是空的所以就会报错。 解决办法 查看我们对table......
el-table组件的height 绑定了一个变量tableHeight,在mounted时,调用了方式设置了tableHeight = 500 (500是假设值)但浏览器窗口变化时,onresize 再次调用了这个方法,这时tableHeight = 300, 但是表格的高度没有变化,通过元素查看器发现还是style="height:500px" 这样就导致滚动条部分看不见,该如何解决 ...
el-table的height设置为calc(100% - 100px)时,渲染后 .el-table 和子元素 .el-table__inner-wrapper 上重复设置了高度导致样式出现问题 What is Expected? 设置的 height 属性只在.el-table 上生效 What is actually happening? .el-table 的高度为 100% - 100px ...
问题发生背景:写了一个table,数据动态获取的,table根据数据总数来判断是否需要设置一个固定高度使得表格可以在超出限制时出现滚动条,但发现el-table里面的height值变化了,但视图并没有更新。 百度了很多方式,有添加this.$forceUpdate(),也有说使用this.$set()来赋值,但尝试过都不行。
用el-table 想让表格高度根据屏幕动态展示,用max-height后发现内容超过高度不展示滚动条 查阅后发现默认是隐藏,而不是滚动展示 如果想让展示,则可以用样式加上overflow-y: auto 全部代码如下 <template><el-tablesize="small":data="tableData":max-height="tableHeight"style="width: 100%; overflow-y: auto...
el element table height 默认值 elelementtableheight默认值 在ElementUI中,`el-table`组件的高度默认值是自动高度。如果需要设置具体的高度值,可以通过`height`属性进行设置。例如,`height="300"`将表格的高度设置为300像素。