2013-10-21 17 views
5

Ho appena iniziato a provare le librerie micro invece di usare jQuery e mi piacerebbe usare qwery con bean. Se imposto bean.setSelectorEngine(qwery); perché non funziona il seguente?Posso usare qwery con bean senza Ender?

bean.on('.masthead', 'click', function() { 
    console.log('click fired'); 
}); 

Sono anche utilizzando bonzo per l'utilità DOM, così ho impostato in modo da utilizzare il dollaro con qwery in modo da poter selezionare gli elementi in modo jQuery simile: ad esempio, $('.masthead').

function $(selector) { 
    return bonzo(qwery(selector)); 
} 

Anche questo non funziona. Non dovrei essere in grado di usare quanto segue con il fagiolo?

bean.on($('.masthead'), 'click', function() { 
    console.log('click fired'); 
}); 

Forse ho perso qualcosa di importante nella documentazione di fagioli .. Cosa devo fare per risolvere questo problema?

Inoltre, sto cercando di evitare l'utilizzo di Ender se possibile, sto cercando di mantenere le mie librerie esterne al minimo.

risposta

7

Sì, è possibile utilizzare tutte queste librerie insieme senza Ender. Ma dovrai collegare tutte le connessioni tra queste librerie.

Questo dovrebbe iniziare:

// make Bean and Bonzo use Qwery 
// as their internal selector engine 
bean.setSelectorEngine(qwery); 
bonzo.setQueryEngine(qwery); 

// to use $ instead of bonzo 
function $(selector, root) { 
    return bonzo(qwery(selector, root)); 
}; 

// $() will return a bonzo object 
// so if you want to be able to use 
// bean's methods on the bonzo object 
// like $().on() 
// you are going to have to extend bonzo 
bonzo.aug({ 
    on: function (eventName, callback) { 
    return this.each(function (elem) { 
     return bean.on(elem, eventName, callback); 
    }); 
    }, 

    // do the same for bean's other methods (fire, off, etc) 
}); 

// now you should be able to do this: 
$('.masthead').on('click', function() { 
    console.log('click fired'); 
}); 

Speranza che aiuta! :)

+0

Grazie mille @Johnny, ci proverò ora – Zander

1

Solo per entrare, ho preso l'esempio di @ Johnny sopra e reso un po 'più generico come ho avuto lo stesso problema. Questo esempio è in CoffeeScript + sottolineatura-Contrib, ma l'idea generale è che non c'è bisogno di avvolgere ogni funzione Bean a mano, è possibile farlo in un ciclo manipolando gli argomenti:

# Setup Qwery/Bonzo 
    window.$ = (selector, root) -> 
    bonzo qwery(selector, root) 

    # Glue Bean event handling into Bonzo/Qwery 
    events = 
    clone : -> 
     args = _.toArray arguments 
     bean.clone.apply null, args 

    _.each ['on','one','off','fire'], (ev) -> 
    events[ev] = -> 
     args = _.toArray arguments 
     this.each (elem) -> 
     bean[ev].apply null, _.cons(elem, args) 

    bonzo.aug events 

speranza che aiuta qualcuno in futuro.