Skip to main content
se añadieron 9 caracteres en el cuerpo
Origen Enlace

Puedes ver el codigo funcionando en el siguiente enlace: https://codesandbox.io/s/vue-template-lh7l7https://codesandbox.io/s/computed-filter-object-lh7l7 El archivo se llama Loop.vue

Puedes ver el codigo funcionando en el siguiente enlace: https://codesandbox.io/s/vue-template-lh7l7 El archivo se llama Loop.vue

Puedes ver el codigo funcionando en el siguiente enlace: https://codesandbox.io/s/computed-filter-object-lh7l7 El archivo se llama Loop.vue

se eliminaron 273 caracteres en el cuerpo
Origen Enlace

Por otro lado tambien tienes la opcion mas sencilla que es filtrar tu objeto en el mismo template agregando un divtemplate extra de esta manera:

<template>
    <div>
    <li    <template v-for="(item, index) in items" :key="index">items">
      <div v-if="recomendada">
      <li v-if="item.recomendada" :key="index">{{ item.nombre }}</li>
      </div>
    </li>template>
    </div>
</template>

PD: En caso no necesites el div tambien puedes usar v-if en un template de esta manera:codesandbox te he dejado las 2 opciones

<template>
  <div>
    <li v-for="(item, index) in items" :key="index">
      <template v-if="recomendada">
        {{ item.nombre }}
      </template>
    </li>
  </div>
</template>

Por otro lado tambien tienes la opcion mas sencilla que es filtrar tu objeto en el mismo template agregando un div extra de esta manera:

<template>
  <div>
    <li v-for="(item, index) in items" :key="index">
      <div v-if="recomendada">
        {{ item.nombre }}
      </div>
    </li>
  </div>
</template>

En caso no necesites el div tambien puedes usar v-if en un template de esta manera:

<template>
  <div>
    <li v-for="(item, index) in items" :key="index">
      <template v-if="recomendada">
        {{ item.nombre }}
      </template>
    </li>
  </div>
</template>

Por otro lado tambien tienes la opcion mas sencilla que es filtrar tu objeto en el mismo template agregando un template extra de esta manera:

<template>
    <div>
        <template v-for="(item, index) in items">
            <li v-if="item.recomendada" :key="index">{{ item.nombre }}</li>
        </template>
    </div>
</template>

PD: En el codesandbox te he dejado las 2 opciones

se añadieron 291 caracteres en el cuerpo
Origen Enlace

Opción 1

Opción 2

El error de vue se refiere a que no puedes filtrar directamente en la etiqueta que tiene el v-for. Pero si puedes filtrar en niveles interiores.

En caso no necesites el div tambien puedes usar v-if en un template de esta manera:

<template>
  <div>
    <li v-for="(item, index) in items" :key="index">
      <template v-if="recomendada">
        {{ item.nombre }}
      </template>
    </li>
  </div>
</template>

El error de vue se refiere a que no puedes filtrar directamente en la etiqueta que tiene el v-for. Pero si puedes filtrar en niveles interiores.

Opción 1

Opción 2

El error de vue se refiere a que no puedes filtrar directamente en la etiqueta que tiene el v-for. Pero si puedes filtrar en niveles interiores.

En caso no necesites el div tambien puedes usar v-if en un template de esta manera:

<template>
  <div>
    <li v-for="(item, index) in items" :key="index">
      <template v-if="recomendada">
        {{ item.nombre }}
      </template>
    </li>
  </div>
</template>
Origen Enlace
Loading