在同一个 app.js vue.js 3 laravel 中挂载任何组件

Question

我正在准备在我的app.js文件中挂载任何数据表：

require('./bootstrap');
import { createApp } from "vue";
import VueGoodTablePlugin from 'vue-good-table-next';
import 'vue-good-table-next/dist/vue-good-table-next.css'
import datatablePhysios from "./components/datatablePhysios.vue";
import datatableTreatment from "./components/datatableTreatment.vue";

const app = createApp(datatablePhysios) // here it´s the component
app.component('datatableTreatment', {
    datatableTreatment
});

app.use(VueGoodTablePlugin);
app.mount("#app")

我正在使用laravel-9 。

我的问题是，总是挂载相同的组件datatablePhysios这是我第一次使用 vue 3 我正在使用 vue 2 并且 nevar 遇到了这个问题。

在 vue 2 中更新我这样做了：

require('./bootstrap');

window.Vue = require('vue');

Vue.component('usuarios-component', require('./components/usuariosComponent.vue').default);
Vue.component('formularioactualizacion', require('./components/datosUsuarios.vue').default);
Vue.component('listadoasistencias', require('./components/mostrarAsistencias.vue').default);
Vue.component('listadobonosdisponibles', require('./components/mostrarBonosDisponibles.vue').default);
Vue.component('listadoasistenciaspendientes', require('./components/mostrarAsistenciasPendientes.vue').default);
Vue.component('estadisticasusuario', require('./components/estadisticasUsuario.vue').default);
Vue.component('estadisticasadmin', require('./components/estadisticasAdmin.vue').default);
Vue.component('tablabusqueda', require('./components/tablaBusquedaAdmin.vue').default);

感谢自述文件并帮助我。 对不起，我的英语不好

Answer 1

我解决了我的问题 nstantiate empty vue object 并在创建了一个组件之后：

require('./bootstrap');

import { createApp } from "vue";
import VueGoodTablePlugin from 'vue-good-table-next';
import 'vue-good-table-next/dist/vue-good-table-next.css'
import datatablePhysios from "./components/datatablePhysios.vue";
import datatableTreatment from "./components/datatableTreatment.vue";

const app = createApp({}) // here it´s the component

app.component('datatable-physios', datatablePhysios)
app.component('datatable-treatment', datatableTreatment);

app.use(VueGoodTablePlugin);
app.mount("#app")