vue scroll事件失效
发表于|更新于
|浏览量:
那些听不见音乐的人认为那些跳舞的人疯了。——尼采。
这个坑，我遇到的时候，百度要么告诉我加高度，要么告诉我用document或者ref去获取节点
可我只想用@scroll事件，于是我在到处加@scroll，在组件上加@scroll.native，在组件里的div上加，在slot中加，然后又给它们挨个加高度，没一个好使，搞的我很头大
后面我突然发现，我给加的，好像并不是实际滚动的地方，那我明白了，首先我给引用组件放入slot中的div指定了样式：
1 | .allow-scroll { |
然后再给它绑定事件@scroll，此处如果该div下的元素高度超出了80vh，则会触发事件。。。这坑踩的，就离谱
相关推荐
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-09-13
下一代测试框架Vitest
仅次于选择益友，就是选择好书。——考尔德 今天分享一个前端的测试框架Vitest 号称是下一代测试框架 github： https://github.com/vitest-dev/vitest 官方文档： https://cn.vitest.dev/ 这里有个直观的在线例子： https://vitest.new/ 你可以看到比如这里在basic.ts定义了一个squared函数 1export const squared = (n: number) => n * n 然后对应的单元测试： 123456import { squared } from '../src/basic.js'test('Squared', () => { expect(squared(2)).toBe(4) expect(squared(12)).toBe(144)}) 其他代码还有 123456789101112131415161718192021222324252627import { a...
2025-04-08
react-explorer
原谅是容易的，忘却则是困难的。——普拉顿 React Explorer: 一个使用 React 和 Electron 的文件管理器项目简介React Explorer 是一个开源的文件管理器项目，使用 TypeScript、React 和 Blueprint 编写，并使用 Electron 打包。它提供了一个跨平台的文件管理解决方案，支持 Linux、macOS 和 Windows 系统。 项目特点 跨平台支持：React Explorer 可以在 Linux、macOS 和 Windows 系统上运行，为用户提供一致的文件管理体验。 现代前端技术：项目使用 TypeScript 和 React 进行开发，确保代码的健壮性和可维护性。 Blueprint 组件库：使用 Blueprint 组件库构建用户界面，提供现代化的 UI 体验。 Electron 打包：通过 Electron 将应用打包成桌面应用，方便用户安装和使用。 状态管理：使用 MobX 进行状态管理，确保应用状态的一致性和响应性。 开源许可：项目采用 MIT 许可，允许用户自由使用和修改代码。 项目主页项目主...
2023-10-19
react-json-view
小不忍，则乱大谋。——孔子 分享一个react的json编辑器 https://github.com/mac-s-g/react-json-view 演示： RJV Demo
2021-05-15
splice
一百个满怀信心和决心的人，要比一万个谨小慎微的和可敬的可尊重的人强得多。——辛克莱 最近发现前端中对于数组有这样一个函数splice非常好用 首先我们可以这样 12var list = [1,2,3,4,5];list.splice(1) 可以看到我们从下标为1开始的2，截取了剩余部分 最后结果为2,3,4,5 但这是splice函数的返回值，我们如果看之前的list，可以看到只剩1了 因为1后面的被我们的splice截取掉啦 那我们如果传入两个参数，例如我这里从下标为3开始，截取两个元素 我们再看看原来的list，果然是剩下的1,2,3 如果我们想要截取时还要对应替换的话？ 例如我这里想把3,4,5替换成4,5,6 就可以这么写 最后得到的list就是我们想要的结果 但如果我们想要截取掉的部分，就直接取splice的返回值即可 这里从下标2开始截取掉了两个元素3,4，换成了4,5
2023-01-22
一个js视差动画
人生碌碌，竞短论长，却不道荣枯有数，得失难量。——《浮生六记》 分享一个js视差动画：https://codepen.io/isladjan/details/abdyPBw 滑动会出现各种动画效果，非常的好玩