我是 Mithril 的新手,正在努力解决这个问题。
我有一个创建 DOM 元素并声明了 onClick 方法的 View 。不幸的是,当我尝试启动诸如 magnificPopup、jqueryui dialog、fancybox 之类的灯箱时,它会调用未定义的方法,即使加载了灯箱库也是如此。
这是 Mithril 的问题吗?
这是我的代码:
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')
最佳答案
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
}})
关于javascript - 无法从 miithril View 启动灯箱,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25554113/