简介
ember-scrolltop-holder是一个用于垂直滚动条的Ember组件。它的主要作用是将页面的滚动条按需滚动到页面顶部，并提供给用户一种便捷的方式返回页面顶部。经过测试，该组件可与大多数主流浏览器兼容，且性能表现良好。
安装
安装ember-scrolltop-holder是非常简单的，只需在终端中使用npm进行以下操作即可：
npm install ember-scrolltop-holder --save
使用
引入组件
在使用ember-scrolltop-holder组件之前，首先需要将其引入到你的Ember项目中。你可以通过以下方式，在app.js文件中引入该组件：
import ScrollTopHolder from 'ember-scrolltop-holder';
渲染组件
在使用ember-scrolltop-holder组件时，需要在视图中添加一个组件标签。这个标签一般会放在应用程序的底部，这样它就能够始终存在于屏幕上方。以下是一个简单的代码示例：
{{scroll-top-holder }}配置组件
滚动到顶部的具体设置可以以属性的形式传递给组件。以下是一些可用属性：
positions
一个位置数组是用于指定在何时呈现ember-scrolltop-holder的组件。默认情况下，该数组只包含一个值0，表示只要滚动条滚动到了指定位置，组件就显示在页面上。
{{#scroll-top-holder positions=(array 0 500) }}speed
此属性用于控制页面返回顶部的速度。默认值是500毫秒。
{{scroll-top-holder speed=500 }}duration
此属性用于控制页面滚动到顶部需要的时间。默认值为1200毫秒。
{{scroll-top-holder duration=1200 }}throttle
此属性用于控制当页面滚动时，组件应该等待多长时间才能将其设置为下一高度。默认值为300毫秒。
{{scroll-top-holder throttle=300 }}classNames
此属性允许您自定义样式名称，以便您可以使用自己的CSS创建类似于ember-scrolltop-holder的滚动条样式。以下是一个示例：
{{scroll-top-holder classNames="my-class-name" }}总结
ember-scrolltop-holder是一个非常方便的组件，可以为Web应用程序提供更好的用户体验。它可以让用户更快地导航到页面顶部，并且还提供了可定制的选项，如滚动速度、延迟时间等等。这篇文章介绍了它的用法，希望能对你的开发工作有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e1ca563576b7b1ecc9d