A. Test.jsx
import Navbarfrom '@/Layout/Navbar'; import { Head, Link } from "@inertiajs/react"; import React from "react"; function Test({datas, create_url}) { return ( <div> <Navbar /> {datas.map(data => <p key = {data.id}>{data.name}</p>)} </div> ) } (because Layout & Pages both are different folders) export default Test;
B. Navbar.jsx
import React from 'react'; import { Head, Link } from "@inertiajs/react"; function Navbar(props) { return ( <main> <header> <Link href={route('home')}>Home</Link> <Link href={route('about')}>About</Link> <Link href={route('contact')}>Contact</Link> </header> </main> ) } export default Navbar;