Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

191
Visualizações
Possible to wildcard select of $refs in Alpine js?

I am wondering if it is possible in Alpine.js to select all the $refs with the same prefix.

For example if I have a list of divs:

<div> 
  <div x-ref="tab-1">some random stuff 1</div>
  <div x-ref="tab-2">some random stuff 2</div>
  <div x-ref="tab-3">some random stuff 3</div>
  <div x-ref="tab-4">some random stuff 4</div>
  <div x-ref="tab-5">some random stuff 5</div>
  <div x-ref="tab-6">some random stuff 6</div>
</div>

Is there anyway to select all the tabs that is starting with "tab-" ? I wanted to do something that is similar to jQuery/QuerySelectorAll

Wildcards in jQuery selectors

getElementById() wildcard

I tried assigning all the tabs with the same reference, but it only seems to return the last element with the reference.

I can access them in individually by using square notation : this.$refs['tab-1'] but I am not sure if there is anyway to do a wildcard selection.

Any kind of advice or discussion is welcome. Thank you.

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

So after browsing through the the documentation and github help section, wildcard selection might not be available yet on alpine.js.

I believe that this is want I needed:

this.$el.querySelectorAll('#tabs');

Find the original post for more information https://github.com/alpinejs/alpine/issues/252

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda