Проблемы с импортом путевой точки - PullRequest
1 голос
/ 25 июня 2019

Я пытаюсь включить модуль путевых точек jquery. Я испытываю ВСЕ из этих проблем при каждой попытке использовать модуль вactjs. В этом случае я получаю каждый из неопределенных - но я пытался даже использовать локальную версию библиотеки и добавить в начало файла

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

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

waypoint Uncaught TypeError: Невозможно прочитать свойство 'each' из неопределенного

Путевая точка 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 Ответ

0 голосов
/ 26 июня 2019

Мне удалось импортировать это следующим образом.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" />
...