1
resposta

v-for mostra routes como undefined

[Vue warn]: Error in render: "TypeError: Cannot use 'in' operator to search for 'routes' in undefined"

routes.js

import Home from './components/home/Home.vue';
import Cadastro from './components/cadastro/Cadastro.vue';

export const routes = [
    { path: '', component: Home, titulo: 'Home'},
    { path: '/cadastro', component: Cadastro, titulo: 'Cadastro'}
];

App.vue

<template>
  <div class="corpo">
    <nav>
      <ul>
        <li v-for="route in routes" :key="route">
          <router-link :to="route.path ? route.path : '/'">
            {{ route.titulo }}
          </router-link>
        </li>
      </ul>
    </nav>
    <router-view></router-view>
  </div>
</template>

<script>
import { routes } from './routes';

export default {
  data() {
    routes: routes
  }
}
</script>
<style>...</style>

Já tentei, segundo os comentários aqui no blog, com :key, sem :key, com index, sem index, de todas as formas e nada, ele não reconhece routes. Deve haver uma outra "sintaxe equivalente" para o uso de v-for que não está sendo explicada, tem mais alunos reclamando, o tempo passa e esses arquivos já estão todos ficando desatualizados, inclusive a sintaxe.

1 resposta
O post foi fechado pois este curso foi descontinuado e não faz mais parte da grade oficial. Bons Estudos!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software