Не удается запустить лайтбокс с miithril Просмотр

Question

Я новичок в Mithril и пытаюсь обернуть голову вокруг этой проблемы.

У меня есть представление, которое создает элемент DOM и объявляет метод onClick. К сожалению, когда я попытался запустить лайтбокс, такой как magnificPopup, jqueryui dialog, fancybox или вы его называете, он вызывает метод undefined, даже несмотря на то, что библиотека лайтбоксов загружена.

Это проблема с Мифрилом?

Вот мой код:

 m('a.view-link', { 
      onclick: function() { 

      $.colorbox(); // this fails 
      alert('here is the code'); // alerts do work 
      $('.view-link').css('border', '2px solid red'); // this works 

      // $('.white-popup').magnificPopup({ // this claims .magnificPopup is undefined 
      // type:'inline', 
      // midClick: true 
      // }); 

      //  $('#dialog').dialog('open'); //jqueryUI dialog claims that .dialog is undefined 

      }, 
     href: '#' 
     } , ' Show link in lightbox') 

Answer 1

Путь Mithril работает путем создания виртуального DOM (т.е. простой-Javascript структуру данных, которая представляет собой шаблон), а затем делает этот виртуальный DOM для создания реальной Дерево DOM.

Когда вы вызываете m(), вы создаете этот виртуальный DOM, поэтому в этот момент элементы DOM еще не существуют в документе. Для того, чтобы интегрировать сторонние библиотеки, правильный способ сделать это с помощью атрибута config (см http://lhorie.github.io/mithril/mithril.html#accessing-the-real-dom-element)

В двух словах, функция config вызывается после рендеринга, и он принимает элемент в качестве аргумента, наряду с некоторые другие параметры, которые помогают контролировать его жизненный цикл.

Синтаксис выглядит следующим образом:

m("a.view-link", {config: function(el) { 
    $(el).colorbox() //initialize jquery plugin 
}}) 

Answer 2

Может быть, $.colorbox(); отсутствует элемент «субъект»?

$(this).colorbox(); должно работать лучше.