vue.js中怎样用onload事件

vue.js中怎样用onload事件,第1张

1、首先创建一个名称为onload的html文件,如下图所示。

2、设置标题为 javascript  onload,如下图所示。

3、在body标签 中加入onload事件,并在事件中加入自定义函数 myonload。

4、在文档区域加入一个h 元素,加入文本内容页面加载完成显示页面内容”,当页面加载完成 后 显示该内容。

5、创建一个自定义函数myload,当页面完成后,调用该自定义函数,并加入alert提示语。

6、在浏览器中打开该文件,首先会d出页面加载完成后调用的myonload函数,在现实页面内容。

<script type="text/javascript">

window.onload=function(){

changeDivHeight()

}

//当浏览器窗口大小改变时,设置显示内容的高度

window.onresize=function(){

changeDivHeight()

}

function changeDivHeight(){            

var h = document.documentElement.clientHeight//获取页面可见高度

document.getElementById("div_ov_y").style.height=h-140+"px"

1.第一步: 先在 data 中去 定义 一个记录宽度是属性;

data: {

screenWidth: document.body.clientWidth   // 这里是给到了一个默认值 (这个很重要)

}

2.第二步: 我们需要讲 reisze 事件在 vue mounted 的时候去挂载一下它的方法;

mounted () {

const that = this

window.onresize = () =>{

return (() =>{

window.screenWidth = document.body.clientWidth

that.screenWidth = window.screenWidth

})()

}

}

3.第三步: watch 去监听这个 属性值的变化,如果发生变化则讲这个val 传递给 this.screenWidth。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11633213.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-17
下一篇2023-05-17

发表评论

登录后才能评论

评论列表(0条)

    保存