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;