Tengo un problema extraño que me está pasando en Vue.js. No sé si es mi culpa o un error.
Cuando uso v-for con una coma antes (v-bind), no me da ningún error pero no muestra nada. Cuando no uso una coma, aparece este error Elements in iteration expect to have 'v-bind:key' directives .
Pero si vuelvo a agregar la coma, se muestra por una fracción de segundo y luego me da el comportamiento mencionado anteriormente.
Código en cuestión:
<template> <div class="outside--wrapper"> <form action=""> <p :v-for="element in words1">{{ element }}</p> </form> </div> </template> <script> export default { name: "Crossword", data() { return { words1: { 1: ["S","i","l","a"], 2: ["S","i","l","a"], 3: ["S","i","l","a"], 4: ["S","i","l","a"], }, } }, } </script>¡Gracias por adelantado!
:v-for es equivalente a v-bind:v-for el error dice que la iteración de la lista debe tener una clave ( v-bind:key o :key )
el codigo correcto es
<p v-for="(elements, key) in words1" :key="key">{{ elements }}</p>consulte https://v2.vuejs.org/v2/guide/list.html#v-for-with-an-Object