vue scroll事件失效
发表于|更新于
|浏览量:
那些听不见音乐的人认为那些跳舞的人疯了。——尼采。
这个坑,我遇到的时候,百度要么告诉我加高度,要么告诉我用document或者ref去获取节点
可我只想用@scroll事件,于是我在到处加@scroll,在组件上加@scroll.native,在组件里的div上加,在slot中加,然后又给它们挨个加高度,没一个好使,搞的我很头大
后面我突然发现,我给加的,好像并不是实际滚动的地方,那我明白了,首先我给引用组件放入slot中的div指定了样式:
1 | .allow-scroll { |
然后再给它绑定事件@scroll,此处如果该div下的元素高度超出了80vh,则会触发事件。。。这坑踩的,就离谱
相关推荐
2021-05-26
百度地图简单对接
地位越高,自我评价就越高,自信心多强,能力就有多强。我们总能表现出与环境的和谐平等。——赫兹里特 效果如下 跟着官网一步一步来即可 申请成为开发者 然后在应用管理里创建应用 填写信息 点击复制AK 然后复制代码 123456789101112131415161718192021222324252627<!DOCTYPE html> <html><head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Hello, World</title> <style type="text/css"> html{height:10...
2022-12-19
css attr
过于大方的施舍会导致盗窃——西塞罗 分享一个css函数attr MDN:https://developer.mozilla.org/zh-CN/docs/Web/CSS/attr attr可以获取我们标签内的属性作为值 例如: 1<p data-foo="hello">world</p> css: 123[data-foo]::before { content: attr(data-foo) " ";} 效果: [data-foo]::before { content: attr(data-foo) " "; } world 除了data-*的自定义属性,也可以获取其他的,例如custom-prefix 123456<style>[custom-prefix]::before { content: attr(custom-prefix);}</style><p custom-prefix="hello"&g...
2024-11-25
uniapp电量百分比显示组件
人人保持头冷脚暖,医师就大叹赚钱难。——佚名 今天有个需求是显示电池电量,我在uniapp的插件市场找到一款 https://ext.dcloud.net.cn/plugin?id=7421 不过不满足需求,电量发生变化后没有实时更新,是因为用的data而不是computed 样式也需要调整美化一下,修改以后的完成品: 1
2024-10-27
typescript-exercises(一)
你要克服的是你的虚荣心、炫耀欲,你要对付的是你时刻想要出风头的小聪明。——毛姆 题目: 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104/*Welcome to: ................................................................ . . . #################### #################### E . . ####################...
2022-07-24
js修改复制到剪贴板的内容
祝你今天愉快,你明天的愉快留着我明天再祝。——《爱你就像爱生命》 MDN:https://developer.mozilla.org/zh-CN/docs/Web/API/Element/copy_event demo: 123456789101112131415161718192021222324252627<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>copy</title></head>&...
2025-05-22
wangeditor渲染node方式
青,取之于蓝而青于蓝;冰,水为之而寒于水。 ——《荀子·劝学》 代码如下: 1234567891011121314import { Boot, createEditor, createToolbar, SlateEditor, SlateElement, SlateNode, SlateText, SlateTransforms} from '@wangeditor/editor'SlateTransforms.insertNodes(editor, nodes)editor.updateView() 这里的nodes格式参考 https://www.wangeditor.com/v5/node-define.html 节点数据结构wangEditor 是基于 slate.js 为内核开发的,所以学习本文之前,要先了解 slate Node 设计 。 是什么很多同学可能根本不知道本文要讲什么,对于这里的“节点”和“数据结构”也不知何意。没关系,接下来通过几个问题,就可以让你快速入门。 我们通过 API 的学习,已经知道...
