vue页面加载完毕之后执行

发表于2021-06-20|更新于2026-02-24

|浏览量:

好奇心造就科学家和诗人。——法朗士

当vue页面加载完成后触发

我们在html开发中经常是使用window.onload实现

1
2
3

window.onload = () => {
    
}

但在vue中我们使用this.$nextTick

1
2
3

this.$nextTick(() => {
    console.log("页面加载完啦~")
})

效果如下

前端

相关推荐

2023-01-20

js获取元素相对于document的坐标

孤独没有什么不好。使孤独变得不好，是因为你害怕孤独。——《孤独六讲》代码如下： 12345const getOffset = el => { const { left, top } = el.getBoundingClientRect() const { scrollTop, scrollLeft } = document.body return { top: top + scrollTop, left: left + scrollLeft }} 使用： 123456789101112131415161718192021222324252627<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content...

2024-10-07

typescript-exercises

要随时牢记在心中：决心取得成功比任何一件事情都重要。——林肯分享一个学习typescript练习的开源项目 github: https://github.com/typescript-exercises/typescript-exercises 网站： https://typescript-exercises.github.io/ 这里有不同的练习，目前是16个，例如： 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103/*Welcome to: ................................................................ . ...

2022-03-31

vue项目配置可选调用链

生活是苦难的，我又划着我的断桨出发了。——博尔赫斯可选调用链就是?.写法有些vue项目没有默认配置，因此只能手动配置介绍：https://babeljs.io/docs/en/babel-plugin-proposal-optional-chaining 安装： 1cnpm i --save-dev @babel/plugin-proposal-optional-chaining 然后配置在根目录下的babel.config.js 新增： 123{ "plugins": ["@babel/plugin-proposal-optional-chaining"]} 完整： 12345678module.exports = { presets: [ "@babel/preset-env", ['@vue/app', { useBuiltIns: 'entry' }] ], "plugi...

2021-12-24

youmightnotneedjquery

你要记得，永远要愉快地多给别人，少从别人那里拿取。——高尔基最近发现一个网站：youmightnotneedjquery https://youmightnotneedjquery.com/ 直译过来就是你可能并不需要jquery…可以看出是有点恶趣味哈哈对应的github地址为：https://github.com/HubSpot/YouMightNotNeedjQuery 这个网站它介绍了很多种使用新版IE新特性代替jquery的方法：例如使用jquery时发送get请求获取json格式的数据 123$.getJSON('/my/url', function(data) {}); 使用IE10+时，不用依赖jquery，直接写 123456789101112131415161718var request = new XMLHttpRequest();request.open('GET', '/my/url', true);request.onload = function() ...

2023-07-12

movyjs

早知如此绊人心，何如当初莫相识。 ——李白分享一个开源项目 https://github.com/rossning92/movy 这是一个生成动画/视频的js库它可以方便地创建动画，也可以直接转换为视频例子：movy.js Editor

2021-11-13

箭头函数与this指向探究

我有明珠一颗，久被尘劳关锁，一朝尘净光生，照破山河万朵。——柴陵郁禅师今天研究了下箭头函数与this，发现了一些挺好玩的特性首先，我们在控制台输入上这段js 123456789101112131415161718192021var handler = { name :'handler', init: function() { let init1 = function(event) { console.log("init1: ", this); let init5 = function(){ console.log("init5: ", this); } init5(); // init5: Window {window: Window, self: Window, document: document, name: '', loca...

阿超

我的名字叫阿超年龄25岁家在北京市职业是软件开发每天最晚也会在八点前回家不抽烟酒浅尝辄止晚上十二点上床保证睡足八个小时睡前写一篇博客再做二十分钟俯卧撑暖身然后再睡觉基本能熟睡到天亮像婴儿一样不留下任何疲劳和压力就这样迎来第二天的早晨健康检查结果也显示我很正常我想说明我是一个不论何时都追求内心平稳的人不拘泥于胜负不纠结于烦恼不树立使我夜不能寐的敌人这就是我在这社会的生活态度

数据加载中