element ui 的table响应式实现列隐藏

本文主要介绍的是element ui框架中的table表格中，响应式的实现列的隐藏效果。列的隐藏可以用v-if来实现，v-show没有效果，我也不知道为什么，搜也没搜到。

首先设置变量show，作为v-if的判断条件；变量screenWidth作为屏幕宽度

screenWidth:window.innerWidth,//浏览器宽度
show:true//判断条件

在mounted钩子中挂载window.onresize方法

mounted(){
	const that = this;
	
	window.onresize = ()=>{
		return (()=>{
		    window.screenWidth = window.innerWidth
                    that.screenWidth = window.screenWidth;
		})()
	}
},

在watch中实时监听浏览器窗口的宽度大小，根据需要，更改show的值，从而实现表格中列的响应式变化

watch: {
	screenWidth(val) {
		this.screenWidth = val
		console.log(this.screenWidth)
		if(this.screenWidth<1919){
			this.show = false
		}else{
			this.show = true
		}
	}
}