Rotas
A URL continua sendo uma rota PHP. O handler decide se a resposta é uma view .mucrm.php ou uma página React.
uri::get aponta para o handler. O handler retorna $this->inertia('Welcome', $props). O nome Welcome é o arquivo da página, não a URL.
Registrar a rota
O mesmo contrato de Rotas. Exemplo real da prova em routes/web.php:
use MUCRM\http\web\handlers\inertia_handler;
uri::get('/inertia', [inertia_handler::class, 'index'])->name('inertia.welcome');
uri::post('/inertia/ping', [inertia_handler::class, 'ping'])->name('inertia.ping');O mesmo nome chega no React. A entrada da Engine publica route(), então a página chama route('inertia.ping') sem importar. Imagem, banner e logo ficam em src() e theme_src(), importados de @mucrm/asset. A página de Assets mostra os dois imports juntos. O controller não precisa repassar a URL. Parâmetros preenchem o placeholder: route('profile.show', { type: 'char', name: 'Ana' }). O que sobrar vira query string.
O mapa não vai nas props do Inertia. A Engine grava storage/framework/cache/inertia/routes-{hash}.js a partir das rotas já registradas, inclusive plugins e admin, e o HTML pede esse arquivo uma vez, antes do React. O mesmo arquivo leva as bases de src(), theme_src() e plugin_src(). O layout escolhe qual arquivo usar. Navegar pela SPA não baixa o arquivo de novo. Criar, alterar ou remover uma rota, ou mudar a base do site ou o tema, muda o hash no próximo HTML, sem npm run build.
Handler
public function index()
{
$this->title('Inertia');
return $this->inertia('Welcome', [
'server' => [
'name' => (string) config('app.server.name', 'MUCRM'),
'version' => (string) config('app.server.version', ''),
],
]);
}$this->title() define o <title> do primeiro HTML. O menu da página é um layout React, não o .mucrm.php. inertia() encerra a view PHP dessa resposta: o layout .mucrm.php não envolve a página React.
Fora de um handler, o helper global é inertia('Welcome', $props). O terceiro argumento é o layout, quando a rota não está num controller.
Navegação SPA
import { Link } from '@inertiajs/react'
export default function Home() {
return <Link href={route('inertia.welcome')}>Abrir</Link>
}Link e useForm pedem a próxima rota com X-Inertia. A barra de endereço muda e o componente troca, sem recarregar o PHP layout.
POST, validação e flash
public function ping()
{
$data = request()->check([
'name' => 'required',
]);
request()->message('Protocolo ok, ' . $data['name'] . '.');
request()->redirect('inertia.welcome');
}import { useForm, usePage } from '@inertiajs/react'
export default function Welcome() {
const { errors, flash, old } = usePage().props
const form = useForm({
name: typeof old?.name === 'string' ? old.name : '',
})
function submit(event) {
event.preventDefault()
form.post(route('inertia.ping'))
}
return (
<form onSubmit={submit}>
<input value={form.data.name} onChange={(e) => form.setData('name', e.target.value)} />
<button disabled={form.processing}>Enviar</button>
{errors?.name ? <p>{errors.name}</p> : null}
{flash?.message ? <p>{flash.message}</p> : null}
</form>
)
}request()->check()em falha redireciona de volta. Os erros chegam emprops.errors.request()->message()viraprops.flashna visita seguinte:typeemessage.- O cookie
XSRF-TOKENcobre o POST. O cliente Inertia enviaX-XSRF-TOKEN. Não precisa do inputcsrf()nessa página. - Redirect para outro host, numa visita Inertia, responde
409comX-Inertia-Location. PUT,PATCHeDELETEredirecionam com303, para o follow-up serGET.
A rota /inertia é a URL. O componente Welcome é o arquivo pages/Welcome.jsx. Várias rotas podem renderizar a mesma página, com props diferentes.