如何将对象传递到要显示的 Inertia.js 页面

How to pass object to Inertia.js page to be displayed

我想要的

将对象传递给正在渲染的 Vue 组件以显示对象的信息

我在做什么

页面控制器

<?php

namespace App\HTTP\Controllers;

use Inertia\Inertia;
use App\Http\Controllers\Controller;
use App\Models\project;

class ProjectController extends Controller {
     
    public function project(project $project){
        return Inertia::render('Projects/ProjectPage', [
            'project' => [
                'id' => $project->id,
                'projectImage' => $project->projectImage,
                'projectText' => $project->projectText,
            ]
        ]);
    }
}

路由到页面

<div v-for="project in this.$page.props.projects" :key="project.id" class="flex flex-row py-2 hover:shadow-lg">
    <inertia-link :href="route('projectPage', project.id)" > <ProjectTile :project="project" class="py-4"/> </inertia-link>
</div>

页面渲染对象

<template>
    <!-- Root div -->
    <div>
        This is the project page
        {{project.projectName}}
    </div>
    <!-- End Root div -->
</template>

<script>
export default {
    props: {
        project: Object,
    }
}
</script>

路线在routes/web.php

Route::get('projects/{projectid}', [ProjectController::class, 'project'])->name('projectPage');

结果

page:Object
    props:Object
        errors:Object (empty)
        project:Object
            id:null
            projectImage:null
            projectText:null

此处传递给控制器​​的参数

public function project(project $project){ ... }

必须与此处路由中引用的内容相同

Route::get('projects/{projectid}')...

解决方案:

public function project(project $projectid){ ... }