reactjs 航点导入问题

IT技术 javascript reactjs jquery-waypoints
2021-05-03 14:03:10

我正在尝试合并 jquery 航点module。我在每次尝试在 reactjs 中使用该module时都遇到了所有这些问题。--在这种情况下，我得到了一个未定义的-但我什至尝试使用本地版本的 lib 并添加到文件的顶部

window.jQuery = window.$ = require("jquery");

http://imakewebthings.com/waypoints/guides/getting-started/
http://imakewebthings.com/waypoints/api/waypoint/
http://imakewebthings.com/waypoints/shortcuts/inview/

航点未捕获类型错误：无法读取未定义的属性“每个”

航点 npm - 错误：无法解析“航点”

in some instances - it errors -- "TypeError:`_libs_jquery_waypoints_js__WEBPACK_IMPORTED_MODULE_3___default.a is not a constructor"`

https://github.com/imakewebthings/waypoints/issues/559

像这样导入

import Waypoint from './libs/jquery.waypoints.js';

代码 

var ele
new Waypoint({
element: ele = $('.threesixty')[0],
handler: function(direction) {
if (direction == 'down') {
  $(ele).addClass('muestra')
} else {
  $(ele).removeClass('muestra')
}
  console.log(direction);
}
});
1个回答

我能够通过以下方式导入它。 http://jsfiddle.net/Lfhepta3/7/

从 lib 文件导入。

import waypoint from './libs/jquery.waypoints.js';

https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.js

在文件的顶部 - 我添加了以下行

window.jQuery = window.$ = require("jquery");

——那我用过的用法是这样的。

              var elem = "vision0";
              var $el = $('.'+elem);

              $el.waypoint(function(direction) {
                if (direction == 'down') {
                  $el.addClass("js-"+elem+"-animate");
                } else {
                  $el.removeClass("js-"+elem+"-animate");
                }
              }, {
                offset: '50%'
              });

div是这样的

      <img className="vision0" src={require(`img/${this.props.data.image}`)} width="900" />
其它你可能感兴趣的问题
上一篇Reactjs：带有 reactjs 的 jQuery 自定义内容滚动器 下一篇在 React Typescript 中访问 c​​hild.type.name