Question

我使用browserify来构建反应组件。我需要使用npm jquery-scrollto plugin https://www.npmjs.com/package/jquery-scrollto，但它不起作用。

我不明白它是如何使用的？也许

var $            = require('jquery');
var ScrollTo     = require('jquery-scrollto');

ScrollTo('#myelem');

或其他什么......

Answer 1

即使使用browserify，jquery.scrollTo仍然是一个jQuery插件，应该被称为$（...）。scrollTo（...）。

你仍然需要它，所以它将自己添加到jQuery.fn，如下所示：

var $            = require('jquery');
require('jquery-scrollto');

$(window).scrollTo('#myelem', 1000);

访问Github page获取文档。

Answer 2

scrollTo需要两件事：要滚动的内容（例如window或div）和目标（#myelem）。你要滚动的东西应该是一个jQuery对象，这就是为什么@Ariel Flesler建议将它包装成这样的：$(thingToScroll)。

在你说到这一点之前，如果你正在使用Browserify，你需要正确导入jQuery和插件。我用谷歌搜索了如何做到这一点，走得更加困惑 - 看起来并不简单。这是一篇SO帖子，看起来就是这样：Configure a generic jQuery plugin with Browserify-shim?

但我建议不要尝试，因为使用React插件可能比它的价值更麻烦。如果你只想滚动window它可能不是那么糟糕，但如果你想滚动页面的元素，你将不得不在React的虚拟DOM和页面上的真实DOM之间来回使用{ {1}} s http://facebook.github.io/react/docs/working-with-the-browser.html。如果您决定使用React，那么使用JavaScript和标准DOM API而不是jQuery会更好。 jQuery的一个优点是它可以在浏览器的DOM实现中处理不一致和错误的工作。 React也为幕后工作做了一些工作。

因此，简短版本是最容易选择是否要使用React或使用jquery。如果不使用jQuery，MDN浏览器API文档可能有所帮助：

https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollTop https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

如何使用jquery-scrollto做出反应？

2 个答案: