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

153
Visualizações
Vue: return filtered list

I have an api which returns the following categories and attributes: enter image description here

No I try to render a list of the attribute_name of each category. The result should look something like this, but I need checkboxes instead of radio buttons: enter image description here

I tried to filter the attributes from the category_id but it doesn't work. With the following code I just get a list of all the attributes

  <ul>
    <li
      v-for="category in categories"
      v-bind:key="category.name"
    >
      <p
        v-for="attributes in category.attributes"
        :key="attributes.attribute_name"
      >{{ attributes.attribute_name }}</p>
    </li>
  </ul>

Does anyone has an idea how I could filter these attributes into their categories? Thanks a lot in advance!

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

0

Something like this is what I think you want. If it is not please try to clarify what you need.

<ul v-for="category in categories" :key="category.name">
  {{category.category_name}}
  <li
    v-for="attributes in category.attributes"
    :key="attributes.attribute_name"
  >
  <input type="checkbox" :id="attributes.attribute_name">
    <label :for="attributes.attribute_name">
      {{ attributes.attribute_name }}
    </label>
  </li>
</ul>
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