virtual-dom: ev-click event binding not working, what dependencies do I need? (dom-delegator? value-event?)
I’m trying to build my own lightweight MVI system using virtual-dom
in my view layer, but I’m struggling to get event binding to work.
The virtual-hyperscript README suggests that I should be able to bind events using ev-click
, but none of my bound functions get fired:
https://github.com/Matt-Esch/virtual-dom/tree/master/virtual-hyperscript
var virtualEl = virtualDom.h('div', {'ev-click': function(ev) {alert("Yo");}}, ['clickable']);
var domEl = virtualDom.create(virtualEl);
$('body').append(domEl);
// clicking created element has no effect
Looking around this and the mercury source suggests that I might need some extra modules like dom-delegator
and value-event
to get event binding working, but neither of the README’s explain how to make it work with the ev-click
syntax.
I should add that I’m not using browserify. Thus far I’ve built and included virtual-dom
and dom-delegator
by downloading them and using browserify --standalone
on each repo. I’ve included them both in my project, and created a delegator before creating elements using virtual-hyperscript
:
// before virtual-dom element creation (but after source include)
delegator = new DOMDelegator()
I’ve pulled this all together in a small github repo to make it easier to see what I’m doing: https://github.com/th3james/Virtual-dom-event-binding-issue/blob/master/index.html
I can’t quote follow how dom-delegator
sees and binds to the events? My understanding from this issue is it uses a shared map:
https://github.com/Raynos/mercury/issues/93
…but looking at the source, I can’t see how this connection is made.
Nudges in the right direction greatly appreciated, as I’m really keen to use virtual-dom
.
About this issue
- Original URL
- State: open
- Created 9 years ago
- Comments: 19 (4 by maintainers)
Use just
onclick: function (ev) { ...
.Use dom-delegator only if you know what you’re doing.
an additional point --each time the vnode is published to the document, the number of listeners returned in chrome matches the number found in the most recently published vnode.