tangdaohai / vue-happy-scroll Goto Github PK
View Code? Open in Web Editor NEW基于vue2.0实现的滚动条插件。scroll component for vue2.0
Home Page: https://tangdaohai.github.io/vue-happy-scroll/
License: MIT License
基于vue2.0实现的滚动条插件。scroll component for vue2.0
Home Page: https://tangdaohai.github.io/vue-happy-scroll/
License: MIT License
Error in nextTick: "TypeError: Cannot read property '0' of undefined"
<happy-scroll resize>
<div>
<div v-for>
item
</div>
</div>
</happy-scroll>
但是外面像这样再嵌套一层就不报了
比如我想在注册的时候就让滚动条默认resize为true之类的
Hi,@tangdaohai 遇到一个问题,先看下我的 HTML代码结构:
<div class="content-wrapper">
<div class="happy-scroll">
<div class="happy-scroll-container" style="width: 320px;height: 210px;">
<div class="happy-scroll-content">
<div id="layers">/* 很长的内容 */</div>
</div>
</div>
</div>
</div>
.content-wrapper
容器的高度可以通过一个鼠标上拉改变高度。导致一个问题是,即使 .content-wrapper
高度改变了,但是 div#layers
的高度未变,其原因是 .happy-scroll-container
高度是内联固定值
上拉改变容器高度时,.happy-scroll-container
高度可以自动计算高度决定是否隐藏和显示滚动条
点击滚动条后 滚动区域会按照滚动条的高度进行滚动
现在是只有垂直方向可以用鼠标滚动滚动条,水平的不可以,虽然说也可以通过鼠标滚轮监听实现该功能,监听结束与开始事件,进行横向鼠标滚动
[Vue warn]: Failed to resolve component: happy-scrolly If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
我什么都在里面添加,只是引用了这个组件,就显示 Cannot read property '0' of undefined at o.computeStripX (happy-scroll.min.js?b355:1)这个错误。
使用时,按照说明在happy-scroll标签内外都设置了div包裹happy-scroll和滚动内容,但发现有效滚动区域始终为半个字大小。
项目结合element-ui使用,是否element-ui对该组件有影响?
1-可否有一个监测外部窗口resize事件的接口,或者一个参数能从外部触发,
2-与elementUI中tabTabs 标签页这样的插件配合使用,每个tab内容中都会有子滚动区域,只有第一个显示的才会有正确的宽高计算,因为happy-scroll如果内容不变,只在mounted计算一次,导致后面的视图宽高为0,这个问题我加了一个v-if可以解决,
3-插件有兼容问题吗?我写的案例在火狐下的高度计算container层和content层高度全为内容的高度,导致无法滚动,谷歌正常.
vue-happy-scroll 当浏览器小窗口打开的时候, 页面布置好了,当点击浏览器全屏的时候,这个时候,在vue-happy-scroll中的元素快,并不会跟着缩放,而不在happy-scroll中的元素就缩放了, 用resize 也没效果, 请问,我应该如何解决?
使用element-ui的collapse组件,使用v-if打开关闭后会被遮盖20像素,发现打开关闭后isScrollNotUseSpace元素是undefined。
解决:
scroll.vue文件
331行Vue._happyJS._isScrollNotUseSpace !== undefined改成this.isScrollNotUseSpace !== undefined即可。
v2.0.1 版本,滚动条移动了,但元素并未移动到指定位置。
您好作者,我的vue-happy-scroll内部的东西是通过v-for循环出来的。但是在页面上面happy-scroll-container这个元素宽和高却是20px,而且控件的滚动事件也被禁用了。我查了一下,网上说循环的外面需要包裹一层盒子,我试着用一个div把循环的内容包裹起来,但是页面依然还是那样,请问我是哪个地方调用错误了吗
滚动条移动到了最顶端,元素却未移动。
在设置每一条数据的高度固定并且容器高度固定的情况下,动态绑定的数据会导致滚动条会无法滚动到最低端,如果使用静态的数据渲染,滚动条正常触底
加上了resize属性,但是浏览器窗口resize的时候,happy-scroll滚动条还存在???
是我配置出错了吗?
请问怎么解决?
目前监听到滚动时发生的值,但是不知如何捕获滚到底部的最大值
能否实现点击实现返回scroll顶部的功能
组件生成以后如果窗口的大小发生了变化 组件内容滚动区域给了固定宽高,不随页面大小发生变化
现在没有点击滚动的效果么,比如说浏览器的滚动条,点击滚动条下边的空白部分,滚动条会随之滚动到鼠标点击地方
moveY赋值之后,并不会滚动回去
组件外层的div我这边业务需求无法限制死宽度,这样做横向滚动的话,滚动条的宽度不会自适应
As we know, when we set this css property and let the list scroll, the ios will forbid many actions.
So I wanna know whether this plugin can works in ios webview.
thx.
在使用组件的时候,组件父级宽度改变了,但是happy-scroll-container的宽高没有随父级宽高响应,
请问,如何在鼠标移入区域显示滚动条时,不要动画?谢谢
在父级是隐藏的情况下没法初始化vue-happ-scroll?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.