[Vuejs]-Creating a layout file in Laravel, Vue, Inertia Js

1👍

You must use a persistent layout for that.

Layout.vue

<template>
   <div>
      <Navbar />
      <slot /> <!-- Don't forget this -->
      <Footer />
   </div>
</template>
    
<script setup lang="ts">
import Navbar from '../components/Navbar.vue';
import Footer from '../components/Footer.vue';    
</script>

MyPage.vue

<script>
import Layout from './Layout'

export default {
  layout: Layout,
}
</script>

<script setup>
defineProps({ user: Object })
</script>

<template>
  <H1>My Page</H1>
  <p>Hello {{ user.name }}, welcome to my page!</p>
</template>

Leave a comment