Hotwire: Stimulus personalizado
O curso mostra como os controllers Stimulus de uma aplicação Rails se comunicam sem guardar referência um ao outro. Começa com dois controllers conectados ao mesmo elemento e segue para o método herdado dispatch() e seus defaults de alvo, detail e propagação. Explica por que o nome do evento recebe o identificador do controller como prefixo e como trocar ou desligar esse prefixo. Depois trata de listeners no mesmo elemento, de listeners @window para eventos customizados e nativos e de vários descritores de ação num só elemento.
O que você vai aprender
- ✓Conectar vários controllers a um elemento com data-controller
- ✓Disparar eventos customizados com this.dispatch() e seus defaults
- ✓A convenção identifier:eventName e a opção prefix
- ✓Escutar eventos disparados no mesmo elemento
- ✓Usar @window com eventos customizados e nativos do navegador
- ✓Combinar vários descritores de ação num único data-action
Múltiplos controllers, um elemento
O data-controller não se limita a um identificador. Escreva dois, separados por espaço, e os dois controllers se conectam ao mesmo elemento de forma independente, cada um com seus próprios targets, values e ciclo de vida. Nenhum sabe que o outro existe, a menos que algo os conecte explicitamente. A…
Ler a aula completa grátis →Currículo
7 aulasMúltiplos controllers, um elemento
Como conectar dois controllers a um elemento com data-controller, cada um com seus targets, values e ciclo de vida.
this.dispatch(): os próprios eventos customizados de um controller
Como o método herdado dispatch() dispara eventos customizados, com defaults para alvo, detail, propagação e prefixo.
A convenção de nome de evento: identifier:eventName
Por que dispatch("search:open") dispara ui--navbar:search:open, e como a opção prefix troca ou desliga o identificador.
Escuta no mesmo elemento: como irb avisa hints que uma tentativa falhou
Como um data-action no mesmo elemento faz o execution--hints capturar o failed do execution--irb e atualizar a trava.
Indo global: @window, e eventos nativos também
Uso do @window para capturar eventos customizados e cliques nativos entre elementos sem relação, como clicar fora para fechar.
Um elemento, múltiplos descritores de ação
Vários descritores separados por espaço num data-action, levando gatilhos a um mesmo método ou a métodos diferentes.
Juntando tudo: a jornada completa de um evento
A jornada de dois eventos do dispatch ao listener, e um desafio que reimplementa a regra de prefixo em Ruby.