vue提醒及错误弹框改变其显示的位置

vue提醒及错误弹框改变其显示的位置

单页面配置
	mounted(){
		this.$message.config({
			top: '120px', // 距离顶端120px,可修改成自己想要的
			duration: 2 // 弹框显示的秒数
		})
	}
全局配置
	main.js 进行引入
	Vue.prototype.$Message.config({
    	top: '120px',
    	duration: 3
	});

组件窗口随浏览器窗口随意变动大小

	<query-module
		:cardInsideWidth = "cardInsideWidth"
	>
		<temple>......</temple>
	</query-module>
	**vue 当窗口发生变化时 watch监听并执行**
	 mounted() {
            const that = this
            window.onresize = () => {
                return (() => {
                    that.cardInsideWidth = window.innerWidth-50
                   // that.cardOutsideWidth = window.innerWidth-50
                })()
            }
        },
	// 基础版本，这版本缺陷频繁改变会出现卡顿，甚至不再改变
	watch: {
		screenWidth (val) {
			this.cardInsideWidth = val
		}
	}
	// 升级版 延迟加载 避免频繁触发resize函数导致页面卡顿
	watch: {
		screenWidth (val) {
			if (!this.times) {
				this.cardInsideWidth = val 
				this.times = true
				let that = this
				setTimeout(function(){
					console.log(that.cardInsideWidth)
					that.times = false
				},400) 
			}
		}
	}