1

我是 Mithril 的新手，并试图解决这个问题。

我有一个创建 DOM 元素并声明了 onClick 方法的视图。不幸的是，当我尝试启动一个灯箱，如 magnificPopup、jqueryui 对话框、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')
4

2 回答 2

2

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
}})
于 2014-08-29T13:13:15.150 回答
0

可能$.colorbox();是缺少“主题”元素吗？

$(this).colorbox();应该工作得更好。

于 2014-09-03T00:15:05.123 回答