The view does not recognize the <Meta> </Meta>
element, it does not show the table or the elements declared in meta.vue
This is my view
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">Lista</div>
<div id="app">
<Meta></Meta>
</div>
</div>
</div>
</div>
</div>
@endsection
when running the project shows nothing (meta.vue is)
<template>
<div>
<div class="panel panel-default">
<div class="panel-heading">Lista de Metas</div>
<div class="panel-body">
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>Id</th>
<th>Sub meta</th>
<th>Descripción</th>
<th>Año</th>
</tr>
</thead>
<tbody>
<tr v-for="meta in metas" :key="meta.key">
<td>{{ meta.META_intId }}</td>
<td>{{ meta.META_varSubmeta }}</td>
<td>{{ meta.META_varDescripcion }}</td>
<td>{{ meta.META_intYear }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
metas: []
};
},
created(){
this.fetchMeta();
},
methods:{
fetchMeta(){
axios.get('/meta').then(respon=>{
this.metas=respon.data.data
});
}
}
}
</script>
and the app.js is:
require('./bootstrap');
window.Vue = require('vue');
Vue.component('meta',require('./components/meta.vue'));
const app=new Vue({
el:'#app'
});