i´m trying to mount any component with vue 3, this component it´s a datatables with vue-good-table-next. For fill this tables i´m using axios. but only i can mount one table.
this it´s my 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(datatableTreatment) // here it´s the component
app.use(VueGoodTablePlugin);
app.mount("#app")
i know that in createApp() i have only one component. But also i´m trying this:
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")
with same result. I don´t know how i can to mount more than one component.
UPDATE (bootstrap.js)
window._ = require('lodash');
try {
require('bootstrap');
} catch (e) {}
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
/**
* Echo exposes an expressive API for subscribing to channels and listening
* for events that are broadcast by Laravel. Echo and event broadcasting
* allows your team to easily build robust real-time web applications.
*/
// import Echo from 'laravel-echo';
// window.Pusher = require('pusher-js');
// window.Echo = new Echo({
// broadcaster: 'pusher',
// key: process.env.MIX_PUSHER_APP_KEY,
// cluster: process.env.MIX_PUSHER_APP_CLUSTER,
// forceTLS: true
// });
Thanks for read me and sorry for my bad english