Vue中如何给Window对象添加方法
时间:2022-08-06 11:13:58|栏目:vue|点击: 次
给Window对象添加方法
大家都知道vue中所有元素都是作用于Vue实例的,可是我使用DCloud的Wap2App打包App之后需要配置sitemap.json,配置onclick事件,但是该事件只能绑定Window下的方法,所以此时就需要在Vue中定义一个方法,并将其绑定在Windows对象下
首先在 App.vue methods 中定义一个方法
methods:{ share(){ //微信分享 ... } }
然后在 mounted 中写下如下代码,将其绑定在 Window 对象下
mounted(){ // 将分享方法绑定在window上 window['share'] = () => { this.share() } },
此时 Window 对象下就有了一个 share 方法可以被调用
为window对象添加事件处理程序
以resize事件为例,要获取窗口变化时的窗口大小:在created钩子函数中为window对象添加事件处理程序
var app = new Vue({ el: '#app', data: { winWidth: { type: Number }, winHeight: { type: Number } }, methods: { viewWidth() { return window.innerWidth || document.documentElement.clientWidth; }, viewHeight() { return window.innerHeight || document.documentElement.clientHeight; }, updateWindow() { this.winWidth = this.viewWidth(); this.winHeight = this.viewHeight(); } }, created() { this.updateWindow(); window.onresize = () => { this.updateWindow(); } } });
上一篇:vue实现验证码倒计时按钮
栏 目:vue
下一篇:vue实现评论列表
本文标题:Vue中如何给Window对象添加方法
本文地址:http://www.codeinn.net/misctech/210039.html