نمایش صفحات – بلاگ – محصولات در inertiajs (laravel+vue)

گاهی اوقات پیش میاد که ما میخوایم با یک روت ثابت به دیتاهای مختلف دسترسی پیدا کنیم .مثلا با روت blog و id خبر به محتویات اون خبر دسترسی پیدا کنیم مثل localhost.com/blog/1  …

برای اینکار در ابتدا یک روت در سمت لاراول تعریف میکنیم :

Route::get('/page/{name}', [PageController::class,'show'])->name('showpage');

در این روت name دیتایی هست که متغیره .

در کنترلر pagecontoller خودمون یک تابع به شکل زیر تعریف میکنیم :

  public function show($name)
    {
            $data = Pages::where('name',$name)->first();
            return Inertia::render('Website/Pages/Pages-Show', [
                'data'=>$data
            ]);
    }

خب حالا صفحه vue  خودمون رو به این شکل تعریف میکنیم :

<template>
...
       {{data}}
...
</template>

<script>

import { computed } from 'vue'
import { usePage } from '@inertiajs/inertia-vue3'
    export default ({
        setup() {
    const data = computed(() => usePage().props.value.data)
    return { data }
  },
    })
</script>

حالا کار تکمیل هست . برای نمایش روت در سمت vuejs  هم به شکل زیر عمل میکنیم :

  <Link :href="route('showpage', { name: 'about' })">About Us</Link>