Laravel/Inertia模型关联问题：无法显示Package关联的State名称

1. 核对模型关联定义 #

确保Package模型正确定义与State的关联关系：

// app/Models/Package.php
class Package extends Model
{
    public function state()
    {
        return $this->belongsTo(State::class);
    }
}

State模型如需反向关联可补充：

// app/Models/State.php
class State extends Model
{
    public function packages()
    {
        return $this->hasMany(Package::class);
    }
}

2. 确认控制器预加载关联数据 #

Inertia传递数据时必须主动预加载关联，否则前端无法获取关联模型内容：

// 错误写法：未预加载state关联
return Inertia::render('Packages/Index', [
    'packages' => Package::all(),
]);

// 正确写法：用with()预加载state
return Inertia::render('Packages/Index', [
    'packages' => Package::with('state')->get(),
]);

分页场景同样需要预加载：

'packages' => Package::with('state')->paginate(10),

3. 检查模型字段可见性 #

如果State模型设置了$hidden属性，确保name字段不在隐藏列表内：

// app/Models/State.php
class State extends Model
{
    // 错误示例：隐藏了name字段
    // protected $hidden = ['name'];

    // 正确示例：确保name字段可见
    protected $visible = ['id', 'name'];
}

4. 前端组件正确访问关联数据 #

前端需通过关联方法名（state）访问对象属性，而非外键字段state_id：

// 错误写法：直接访问state_id的name属性
{package.state_id.name}

// 正确写法：访问预加载的state对象的name，用可选链避免空值报错
{package.state?.name}

5. 验证Inertia返回的数据结构 #

打开浏览器DevTools的Network面板，查看Inertia请求返回的JSON数据，确认每个package对象包含state子对象且该对象存在name字段。若不存在，说明后端预加载或模型配置存在问题。

内容的提问来源于stack exchange，提问作者Zack Z