[Vuejs]-Error inertia-link in pagination component

by

2👍

Import Link component as inertia-link in the app.js file:

import {createInertiaApp, Link} from '@inertiajs/inertia-vue3';

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => require(`./Pages/${name}.vue`),
    setup({el, app, props, plugin}) {
        return createApp({render: () => h(app, props)})
            .component('inertia-link', Link)
            .use(plugin)
            .use(ElementPlus)
            .mixin({methods: {route}})
            .mount(el);
    },
});`
👤Ale Vladulescu

1👍

You can fix this by using this template:

<template>
  <div v-if="links.length > 3">
    <div class="flex flex-wrap -mb-1">
      <template v-for="(link, key) in links" :key="key">
        <div v-if="link.url === null"  class="mr-1 mb-1 px-4 py-3 text-sm leading-4 text-gray-400 border rounded" v-html="link.label" />
        <inertia-link v-else class="mr-1 mb-1 px-4 py-3 text-sm leading-4 border rounded hover:bg-white focus:border-indigo-500 focus:text-indigo-500" :class="{ 'bg-white': link.active }" :href="link.url"><span v-html="link.label"></span></inertia-link>
      </template>
    </div>
  </div>
</template>
👤EnisKPTeam

Leave a comment