Underscore: _.debounce() perde event.currentTarget

Criado em 23 out. 2014  ·  8Comentários  ·  Fonte: jashkenas/underscore

Não consigo obter o event.currentTarget ao usar addEventListener com _.debounce() .

Aqui está um violino .

Comentários muito úteis

@jridgewell alguma ideia de como contornar isso em um React onChange. quando eu não uso debounce eu consigo acessar o evento correto na minha função onChange mas quando eu uso _.debounce eu perco o event correto – veja abaixo

// in my render
<input onChange={ _.debounce(this.updateNote.bind(this), 500) } />
// my change handler
updateNote(event) {
    // undefined on event.target, get lodash event not <input/> event target
    const note = event.target.value
    this.sendNote({ note })
 }

Todos 8 comentários

Se a propriedade for alterada na referência do objeto de evento que está fora do escopo do Underscore. Se você usar uma lib como o jQuery, isso pode ajudar, pois eles criam um objeto de evento sintético ao qual você deve poder fazer referência sem problemas.

Eu não acho que você vai contornar isso. event é reutilizado à medida que se propaga no DOM, com currentTarget mudando para cada elemento com um ouvinte. violino

Passar um segundo parâmetro pode contornar isso. violino

var debounced = _.debounce(fn, 50);
document.querySelector('.debounced-input').addEventListener('keyup', function(event) {
    debounced(event, event.currentTarget);
});

Sim, isso está fora do escopo do sublinhado. Considere um micro framework de eventos DOM como gator

Aqui está um exemplo disso trabalhando com jQuery.

Eu ainda posso pegar o elemento que currentTarget normalmente tem com this ; Acabei de abrir este problema para ter certeza de que o que estou vendo é realmente o comportamento esperado.

@jridgewell alguma ideia de como contornar isso em um React onChange. quando eu não uso debounce eu consigo acessar o evento correto na minha função onChange mas quando eu uso _.debounce eu perco o event correto – veja abaixo

// in my render
<input onChange={ _.debounce(this.updateNote.bind(this), 500) } />
// my change handler
updateNote(event) {
    // undefined on event.target, get lodash event not <input/> event target
    const note = event.target.value
    this.sendNote({ note })
 }

Veja minha segunda sugestão .

Isso é uma questão de implementação. Você precisa persistir o evento. onChange deve chamar um persist e ENTÃO passar o evento persisted para o manipulador debounced:

onChange_persist = (e) =>
{
    e.persist();
    e.onChange_debounced(e);
}
Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

markvr picture markvr  ·  3Comentários

afranioce picture afranioce  ·  8Comentários

clouddueling picture clouddueling  ·  3Comentários

jdalton picture jdalton  ·  6Comentários

Francefire picture Francefire  ·  5Comentários