Splitbutton without vue-router

UI Components for Vue
Post Reply
alierdem
Posts: 1
Joined: 14 Dec 2021, 20:53

16 Dec 2021, 10:45

hi
i want to use splitbutton but it uses MenuModel which depends on vue-router. i am using primevue with laravel inertia. is there any way i can use it without vue router ?

MarkEdmunds
Posts: 5
Joined: 04 Nov 2021, 12:20

04 Aug 2022, 14:05

You can create a little helper component in your app.js to route any vue-router calls through to inertia-link.

See the router-link component below:

Code: Select all

import './bootstrap';
import Vue, { createApp, provide, h } from "vue";
import { createInertiaApp } from "@inertiajs/inertia-vue3";
import PrimeVue from 'primevue/config';
import { InertiaLink } from '@inertiajs/inertia-vue3';
import { InertiaProgress } from "@inertiajs/progress";

InertiaProgress.init();

/* The router-link special component is required for the primevue
   menu model derived components.  It is normally handled by vue-router
   however because we are using inertia, so instead I pass the 'to'
   parameter across to inertia-link as a href so it can do it's magic.
 */
createInertiaApp({
    title: (title) => `${title} - CGS`,
    resolve: (name) => require(`./Pages/${name}`),
    setup({el, App, props, plugin}) {
        createApp({render: () => h(App, props)})
            .use(plugin)
            .use(PrimeVue)
            .component('inertia-link', InertiaLink)
            .component("router-link", {
                props: ["to","custom"],
                template: `<inertia-link :href="to"><slot/></inertia-link>`,
            })
            .use(Notifications)
            .mixin({methods: {route}})
            .mount(el);
    },
});

Post Reply

Return to “PrimeVue”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests