Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Problemas na criação de componentes

Olá estou tendo problemas com a criação do componente meu-painel, ele não está sendo renderizado na minha view. Segue os códigos abaixo:

Painel.vue

<template>

        <div class="painel">
          <h2 class="painel-titulo"> {{ titulo }}</h2>
          <slot class="painel-conteudo">

          </slot>
        </div>

</template>

<script>

export default {
    props: ['titulo']      
}

</script>

<style>
***RETIRADO***
</style>

App.vue

<template>
   <div class="corpo">

    <h1 class="centralizado">{{ titulo }}</h1>

    <ul class="lista-fotos">
      <li class="lista-fotos-item" v-for="foto in fotos">

       <meu-painel :titulo="foto.titulo">
        <img class="imagem-responsiva" :src="foto.url" :alt="foto.titulo">
       </meu-painel>

      </li>
    </ul>

  </div>
</template>

<script>
import Painel from './components/shared/painel/Painel.vue';

export default {

   components: {
     'meu-painel': 'Painel'
   },

    data()  {
      return {
        titulo: 'API-WIN',
        fotos: []

         }
    },
    created() {
    this.$http.get('http://localhost:3000/v1/fotos')
          .then(res => res.json())
          .then(fotosapi => this.fotos = fotosapi, err => console.log(err))
    }

}
</script>

<style>
*** ***
</style>

Console

[Vue warn]: Invalid Component definition: Painel

found in

---> <App> at C:\api-view\src\App.vue
       <Root>
1 resposta
solução!

Encontrei o erro:

App.vue

Trecho correto:

   components: {
     'meu-painel':  Painel
   },