Estoy configurando varios campos de Algolia/autocompletar en una clase ES6, me gustaría extraer el controlador onSelect , para poder usar algunos atributos de datos en el nodo HTML, pero no sé cómo hacerlo.
Aquí está mi clase JS:
import { autocomplete } from '@algolia/autocomplete-js'; export default class AutocompleteSetUp { init() { document.querySelectorAll('.entity-autocomplete').forEach(elem => { this.autocomplete_elem_setup(elem); }); } autocompleteSelectionHandler(some params) { console.log('I NEED TO PERFORM SOME ACTIONS HERE'); } autocomplete_elem_setup(htmlNode) { autocomplete({ container: htmlNode, // DYNAMIC SEARCH getSources({ query }) { return fetch( `/artists.json?query=${query}` ) .then((response) => response.json()) .then((data) => { return [ { sourceId: `artists`, getItems() { return data; }, getItemInputValue({ item }) { return item.name; }, // ... templates: { header() { return 'Suggestions'; }, item({ item }) { return `Artist: ${item.name}`; }, footer() { return 'Powered by Algolia Autocomplete'; }, }, onSelect({ item }) { console.log(item); console.log('container:', htmlNode ); console.log('source:', source ); // Here I'm able to perform some actions // But I need to extract this code in another function in the class: // How can I call autocompleteSelectionHandler ? // This doesn't work: this.autocompleteSelectionHandler(some_params); }, }, ]; }); }, }); } } Para ser honesto, también me encantaría exigir otros controladores para "clean_codeness" (como item en templates ), pero necesito llamar a varios métodos en onSelect , así que realmente no tengo otra opción.