Laravel jetstreamでユーザー情報に別テーブルでサブ情報を追加したが、表示できない。

前提

Laravel8 jetstream livewire --teams

Laravel jetstreamのデフォルトのユーザー情報に
サブ情報（userprofile）として、
別テーブル（UserProfile）・別フォーム画面（以下、参照）を作成しました。

別フォーム画面
details.blade.php
@livewire('profile.update-user-profiledetails-form')

Controllerのshowで、userは元々から$request->user()となっていたが、
どこで、$requestにuserの情報を設定しているかわからなかったので、
userprofileは、テーブルから取得することにした。

実現したいこと

別フォーム画面に別テーブル（UserProfile）の情報を表示させたい。

発生している問題・エラーメッセージ

Controllerのshowでサブ情報（userprofile）を取得しているが
bladeに値を表示できない。エラーになる。

update-user-profiledetails-form.blade.php
では、$this->user->idで、userの情報を表示させることができるが、
なぜかわからない。

{{ $this->userprofile->id }}の場合のエラーメッセージ

Livewire\Exceptions\PropertyNotFoundException
Property [$userprofile] not found on component: [laravel.jetstream.http.livewire.update-profile-details-form]

{{ $userprofile->id }}の場合のエラーメッセージ

ErrorException
Undefined variable: userprofile (View: /Users/・・・/Desktop/・・・/resources/views/profile/update-user-profiledetails-form.blade.php)

@livewire('profile.update-user-profiledetails-form', ['userprofile'=>$userprofile])
と
{{ $userprofile->id }}とした場合のエラーメッセージ※上記と変わらず

ErrorException
Undefined variable: userprofile (View: /Users/・・・/Desktop/・・・/resources/views/profile/update-user-profiledetails-form.blade.php)

該当のソースコード

/routes/jetstream.php

use Illuminate\Support\Facades\Route;
use Laravel\Jetstream\Http\Controllers\CurrentTeamController;
use Laravel\Jetstream\Http\Controllers\Livewire\ApiTokenController;
use Laravel\Jetstream\Http\Controllers\Livewire\PrivacyPolicyController;
use Laravel\Jetstream\Http\Controllers\Livewire\TeamController;
use Laravel\Jetstream\Http\Controllers\Livewire\TermsOfServiceController;
// use Laravel\Jetstream\Http\Controllers\Livewire\UserProfileController;
use App\Http\Controllers\UserProfileController;#<-上記を変更
use App\Http\Controllers\UserProfileDetailsController; #<-追加
use Laravel\Jetstream\Http\Controllers\TeamInvitationController;
use Laravel\Jetstream\Jetstream;

Route::group(['middleware' => config('jetstream.middleware', ['web'])], function () {
    if (Jetstream::hasTermsAndPrivacyPolicyFeature()) {
        Route::get('/terms-of-service', [TermsOfServiceController::class, 'show'])->name('terms.show');
        Route::get('/privacy-policy', [PrivacyPolicyController::class, 'show'])->name('policy.show');
    }

    $authMiddleware = config('jetstream.guard')
            ? 'auth:'.config('jetstream.guard')
            : 'auth';

    $authSessionMiddleware = config('jetstream.auth_session', false)
            ? config('jetstream.auth_session')
            : null;

    Route::group(['middleware' => array_values(array_filter([$authMiddleware, $authSessionMiddleware]))], function () {
        // User & Profile...
        Route::get('/user/profile', [UserProfileController::class, 'show'])->name('profile.show');
        Route::get('/user/profiledetails', [UserProfileDetailsController::class, 'show'])->name('profile.details');#<-追加
 (以下、省略)

/app/Http/Controllers/UserProfileDetailsController.php

namespace App\Http\Controllers;

use Illuminate\Support\Facades\Auth; // ←これを追加
use Illuminate\Http\Request;
use App\Http\Controllers\Controller; // ←これを追加
use App\Models\UserProfile; // ←これを追加

class UserProfileDetailsController extends Controller
{
    //
    public function show(Request $request)
    {
        $userprofile=UserProfile::where('user_id',Auth::user()->id)->first(); #<-追加

        return view('profile.details', [
            'request' => $request,
            'user' => $request->user(),
            'userprofile' => $userprofile, #<-追加
        ]);
    }    
(以下、省略)

/resources/views/profile/details.blade.php

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Profile Details') }}
        </h2>
    </x-slot>
    <div>$userprofile->id:{{ $userprofile->id }}　＜＝★★ここは表示できる。
        <div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">
            @livewire('profile.update-user-profiledetails-form')
        </div>
    </div>
</x-app-layout>

/resources/views/profile/update-user-profiledetails-form.blade.php

<x-jet-form-section submit="updateProfileDetails">
    <x-slot name="title">
        {{ __('Profile Details Information') }}
    </x-slot>

    <x-slot name="description">
        {{ __('Update your account\'s profile details information.') }}
    </x-slot>

    <x-slot name="form">
        <div class="col-span-6 sm:col-span-4"> 
{{ $this->userprofile->id }}　＜＝★★表示できない

(以下、省略)

試したこと

/resources/views/profile/update-user-profiledetails-form.blade.php

{{ $this->userprofile->id }}　＜＝★★表示できない
{{ $userprofile->id }}　＜＝★★表示できない

/resources/views/profile/details.blade.php

@livewire('profile.update-user-profiledetails-form')
以下に変更したが、受け渡せない。
@livewire('profile.update-user-profiledetails-form', ['userprofile'=>$userprofile])

補足情報（FW/ツールのバージョンなど）

macOS Monterey 12.6
Laravel8.83.27 jetstream livewire --teams
Composer version 2.0.14

以上、よろしくおねがいします。

行動規範の内容に同意します

回答1件

リレーションを覚えるのが先。

php
1class User extends Model
2{
3    public function userProfile()
4    {
5        return $this->hasOne(UserProfile::class);
6    }
7}

リレーションを設定できていれば$user->userProfile()で使えるのでUserProfileDetailsControllerとか作ってる部分は全部不要。

次にprofileページはresources/views/profile/show.blade.phpを変更。
質問からはLivewireのことを全く知らないようにしか見えないけどLivewireを使うならLivewireの作り方で作る。 https://laravel-livewire.com/
別にLivewireを使わなければならないわけではないから普通にBladeでフォームを作ってコントローラーで処理してもいい。普通のLaravelの使い方。

投稿2023/01/02 04:39

kawax

総合スコア10377

novonovo

2023/01/02 06:36

早速、回答をありがとうございます。 Laravelは少し使ったことがあるのですがLivewireはほぼ初めてです。以下のような構成を考えていたもので、既存のものを流用したほうが、挙動やUIも同じになって、かつ、ソースもキレイになるかと考えました。ダッシュボード |-アカウント※既存のプロフィール |-プロフィール※今回、作ろうとしたサブ情報 |-etc. |-ログアウト結果、余計にハマってしまいました。 4日ほどが頑張りましたが、現在、取得と更新ができない状態です。しかも、ゴミファイルなどで、かえって汚くなってしまいました。。。勉強にもなるかと思ったのですが。１．Livewireを使わずに、普通のLaravelの使い方でやる。２．Livewireの作り方で作る。このどちらかでやったほうがいいですね。※２は少し試したのですがうまく行かずに諦めました。。。折角、回答を頂いたのに、リレーションの設定はもちろんLivewireを理解できていません。申し訳ないです。回答について、少し試したのですが駄目でした。どこを変更していいかわからなかったです。ありがとうございました。

行動規範の内容に同意します