3

ya lo intente muchas veces y no se que error estoy omitiendo

Error

    [Vue warn]: Unknown custom element: <usuarioTabla-component> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
(found in <Root>)

Solo intento crear un componente y me marca error

   require('./bootstrap');

window.Vue = require('vue');

Vue.component('example-component', require('./components/ExampleComponent.vue').default);
Vue.component('prueba-component', require('./components/PruebaComponent.vue').default);
Vue.component('usuarioTabla-component', require('./components/usuario/UsuarioTablaComponent.vue').default);

const app = new Vue({
    el: '#app',
});


<template>
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-8">
                <div class="card">
                    <div class="card-header">Usuario table</div>

                    <div class="card-body">
                        Usuario table.
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        mounted() {
            console.log('Component mounted.')
        }
    }
</script>



<usuarioTabla-component></usuarioTabla-component>
1
  • puedes poner tu respuesta abajo para darte puntos ya quedo gracias era los malditos guiones que coraje me tarde mucho con esto el 30 ene. 2020 a las 20:30

1 respuesta 1

2

Te paso directamente lo que dice en la documentación para que quede más claro, pues veo que estás usando un híbrido entre las dos opciones para registrar el componente. Te sugiero que elijas una de ellas y la adoptes como convención para todo el proyecto.

Registro de Componentes. Nomenclatura

Tiene dos opciones cuando define el nombre de un componente:

Con kebab-case

Vue.component('my-component-name', { /* ... */ })

Al definir un componente con kebab-case, también debe usar kebab-case al hacer referencia a su elemento personalizado, como en <my-component-name>.

Con PascalCase

Vue.component('MyComponentName', { /* ... */ })

Cuando define un componente con PascalCase, puede usar cualquiera de los dos casos al hacer referencia a su elemento personalizado. Eso significa que tanto <my-component-name> como <MyComponentName> son aceptables. Sin embargo, tenga en cuenta que solo los nombres de casos de kebab son válidos directamente en el DOM (es decir, en las plantillas que no son string-template).

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.