vue+element-ui表格最⼤⾼度适配解决⽅案第⼀步：utils⽬录下创建⼀个⽂件为directive，新建auto-height.js⽂件，
export default {
componentUpdated(el, binding, vnode) {
const ctx = t;
if (!ctx || typeof ctx[binding.arg] === 'undefined' || ctx.autoHeightResizeListenner) return;
ctx.autoHeightResizeListenner = () => {
let top = el.offsetTop;
let cur = el.offsetParent;
while(cur !== null) {
top += cur.offsetTop;
cur = cur.offsetParent;
}
const h = (window.innerHeight - top) + binding.value;
ctx[binding.arg] = Math.max(h, 100 );
};
window.addEventListener('resize', ctx.autoHeightResizeListener, false);
setTimeout(ctx.autoHeightResizeListenner, 50);
},
unbind(el, binding, vnode){
const ctx = t;
if(ctx && ctx.autoHeightResizeListener) {
element表格横向滚动条
ctx.autoHeightResizeListener = null;
}
},
};
第⼆步：全局配置  在main.js中导⼊ auto-height.js⽂件
import autoHeight from './utils/directive/auto-height';
Vue.directive('auto-height',autoHeight)
第三步：组件中需要的标签添加两个属性  v-auto-height:maxHeight = '-10' :max-height="maxHeight"
<el-table  v-auto-height:maxHeight = '-10' :max-height="maxHeight"></el-table>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。