vue scroll事件失效
发表于|更新于
|浏览量:
那些听不见音乐的人认为那些跳舞的人疯了。——尼采。
这个坑,我遇到的时候,百度要么告诉我加高度,要么告诉我用document或者ref去获取节点
可我只想用@scroll事件,于是我在到处加@scroll,在组件上加@scroll.native,在组件里的div上加,在slot中加,然后又给它们挨个加高度,没一个好使,搞的我很头大
后面我突然发现,我给加的,好像并不是实际滚动的地方,那我明白了,首先我给引用组件放入slot中的div指定了样式:
1 | .allow-scroll { |
然后再给它绑定事件@scroll,此处如果该div下的元素高度超出了80vh,则会触发事件。。。这坑踩的,就离谱
相关推荐
2023-09-13
字体按宽度自适应大小
不用给我爱,不用给我钱,不用给我声誉,给我真理吧。——梭罗的《瓦尔登湖》 一般可以使用vw或者em一类的属性来适配,但如果还需要更小,就只能使用scale缩放了,例如使用js 1234567891011121314151617181920212223242526function scaleMemberName(memberElement: Element | null, reset: boolean) { if (!memberElement) { return; } const nameElement = memberElement.querySelector('.name'); if (!(nameElement instanceof HTMLDivElement)) { return; } if (reset) { nameElement.style.scale = String(); return; } const boundingBox ...
2022-11-15
ERROR Plugin load failed: hexo-generator-json-content
天道之数,至则反,盛则衰。人心之变,有余则骄,骄则缓怠。——管子 发现博客里hexo命令突然用不了了(我重新cnpm i了一下导致的) 报错如下: 既然报错这个模块,我们进去看看 然后发现了端倪,这里用到的hexo-util选择的最新版,且下面根本没有dist目录,但是之前还是好的,并且我此处出现两个hexo-util版本。。。 看了下源码地址,原来四天前发版了 解决办法: 进入报错的hexo目录 12345cd D:\file\blog\blog\node_modules\hexo-generator-json-content# 卸载新版本npm uni hexo-util# 安装 2.7版本npm i hexo-util@2.7 再返回到我们博客目录 成功执行hexo命令
2021-05-21
jquery跳转页面指定元素位置
懒惰象生锈一样,比操劳更能消耗身体;经常用的钥匙,总是亮闪闪的。——富兰克林 代码如下 12345678// 获取到jquery节点 var targetDom = $('#achao') // 获取x坐标 var x = targetDom.offset().top; // 获取y坐标 var y = targetDom.offset().left; // 页面800ms内跳转到x坐标-200的地方 $('html,body').animate({scrollTop: x-200}, 800);
2022-08-31
资源路径与blobUrl互转
害怕树敌的人永远得不到真正的朋友——哈兹里特 首先是普通资源URL转换为blobUrl 12345678910111213// 生成blobURLconst xhr = new XMLHttpRequest();xhr.open('GET', 'https://VampireAchao.github.io/imgs/preview/3356_3.jpg', true);xhr.responseType = 'blob';xhr.onload = function (e) { if (this.status == 200) { var blob = this.response; console.log(blob); // document.getElementById("myImg").src = URL.createObjectURL(blob); console.log(URL.createObjectURL(bl...
2026-03-25
editor
集腋成裘,聚沙成塔。几秒钟虽然不长,却构成永恒长河中的伟大时代。——弗莱彻 Pascal Editor有些编辑器喜欢写字,有些编辑器喜欢画画,而 Pascal Editor 更像一个戴着安全帽的建筑师:他不在纸上涂涂改改,他直接把你拽进三维空间里,抬手就是一堵墙,转身就是一块楼板,眨眼之间,一个 Site、一栋 Building、好几层 Level 就搭起来了——而且他跑在 React Three Fiber 与 WebGPU 的快车道上,动作利落,手感顺滑。 一句话就把他的人设钉死在门口: A 3D building editor built with React Three Fiber and WebGPU. 视频入口也在 README 里(那是他给你递来的“看我施工”的短片):https://github.com/user-attachments/assets/8b50e7cf-cebe-4579-9cf3-8786b35f7b6b 住址(Homepage)他把自己的工作室地址挂得很显眼: https://editor.pascal.app 这是一个 Turbo...
2024-10-08
深入理解 JavaScript 异步
美丽的姿态胜过美丽的脸孔,美丽的行为胜过美丽的姿态。——爱默生 学习js异步可以看这个 https://github.com/wangfupeng1988/js-async-tutorial 2014年秋季写完了《深入理解javascript原型和闭包系列》,已经帮助过很多人走出了 js 原型、作用域、闭包的困惑,至今仍能经常受到好评的留言。 很早之前我就总结了JS三座大山这个概念(虽然没有到处宣扬),前两座(原型、作用域)已经基本讲明白,而第三座(异步)也应该做一个总结。 于是,2017年初春,我花费大约一周的业余时间来对 JS 异步做一个完整的总结,和各位同学共勉共进步! 目录part1 基础部分 什么是异步 异步和 event-loop 事件绑定算不算异步? part2 jQuery的解决方案 jQuery-1.5 之后的 ajax jQuery deferred jQuery promise part3 ES6-Promise Promise 加入 ES6 标准 Promise 在 ES6 中的具体应用 对标一下 Promise/A+ 规范 Pro...

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