this.$page.props.user 中如何用inertiajs设置上传头像?

How set uploaded avatar in this.$page.props.user with inertiajs?

在 Laravel 8 应用中 inertiajs/inertia-vue 0.7/vuejs2 with fortify(但没有 jetstream)

我用"spatie/laravel-medialibrary": "^9.9"上传头像

$loggedUser = auth()->user();
$avatar_file_path = $avatarImageUploadedFile->getPathName();
$loggedUser->addMedia( $avatar_file_path )->toMediaCollection('avatar');

它可以工作,但是当我使用

时,我可以通过什么方式在客户端使用头像?
this.$page.props.user

在 vue 组件属性中检查哪个用户已登录并显示他的信息?

谢谢!

您可以使用 'Shared data' feature via the HandleInertiaRequests middleware 来做到这一点。

例如,要共享用户信息,您可以执行以下操作:

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Storage;

class HandleInertiaRequests extends Middleware
{
    public function share(Request $request)
    {
        return array_merge(parent::share($request), [
            'user' => function () {
                return Auth::user() ? [
                    'id' => Auth::user()->id,
                    'name' => Auth::user()->name,
                    'email' => Auth::user()->email,  
                    // get path to avatar
                    'avatar' => Storage::url('avatar-of-the-user.jpg'),
                ] : null;
            },
        ]);
    }
}

然后您可以在客户端使用 this.$page.props.user.avatar.

访问头像的 URL