Использование npm Packery в Meteor - PullRequest
Новая
       23

Использование npm Packery в Meteor

0 голосов
/ 21 ноября 2018

При создании простого модуля Packery / Draggabilly в Meteor я столкнулся с проблемой импорта функции конструктора.При использовании оператора импорта Packery или Draggabilly не будет отображаться в консоли, тогда как при использовании <script src= cdn...> в html-шаблоне (в качестве теста) это произойдет.

В любом случае, я не мог заставить работать упаковку, драггабилли и т. Д.Мне было непонятно, как или где их добавить в onCreated, helpers и т. Д. 

import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';
import { Packery } from 'packery';
  console.log("Packery contructor is " + Packery + ". Why?") // undefined
  console.log("However, packery is a " + packery + ".") // function
import { Draggabilly } from 'draggabilly';
import './main.html';

Template.grid.onCreated(function gridOnCreated() {
  this.items = new ReactiveVar();
});

Template.grid.helpers({
  items() {
    return Template.instance().items.get(false);
  },
});

Template.grid.onRendered(function() {
  var elem = document.querySelector('.grid');
  // INITIALIZE PACKERY
  var $grid = $('.grid').packery({  // Packery, packery still not defined
    itemSelector: '.grid-item',
    columnWidth: 240
  });
  // DRAGGABILLY
  $grid.find('.grid-item').each( function( i, gridItem ) {
    var draggie = new Draggabilly( gridItem );
    $grid.packery( 'bindDraggabillyEvents', draggie );
  });
})

Template.grid.events({
    'change [name="uploadCSV"]' ( event, template ) {
      const inventory = event.target.files[0];

      Papa.parse(inventory, { // works like a charm
        header: true,
        complete: function(results) {

          let items = results.data;
          template.items.set(items); // {{#each item of items}} populates template correctly

        } // END complete
      }); // END parse
  }, // change
}); // events

Код репо https://github.com/dylannirvana/gridorderapp/tree/master/meteor

Все заполнено, но япока нет доступа к Packery, Draggabilly и т. д.

Огромная благодарность за любую помощь.Я понимаю, что проблема, с которой я столкнулся, все еще связана с моим относительным незнакомством с МетеоромБольшое вам спасибо!

...