Laravelで生成されたURLをVue.jsにバインドする方法は？コンポーネント内の

Question

、現在のユーザーのデータをAxiosで取得しています。 avatars/1/mNpxJNRrRPbbWSx0kuIL40JQJIF5SM5dscTq3zpv.jpeg

私はこれをStorage :: disk（ "s3"）に挿入する必要があります。だから私はどのように私のコンポーネント内の変数のアバターを許可するのだろうか？

私はこのように試してみました：ブレード・ビューまたはコンポーネントにストレージを使用している場合、私はわからないんだけど...

Answer 1

を<img :src="'Storage::disk("s3")->url(' + this.user.avatar + ')'">しかし、私はエラーを取得します。わかりやすくするために、VueコンポーネントのファサードをStorageにすることはできません。それはLaravelのためだけです。

コンポーネントには小道具を受け入れるか、またはStorageファサードの助けを借りてURLを返すLaravelルートを作成することができます。

オプション1 - ブレード・ビューで

を渡しプロップ、

<my-component :src="'{{ Storage::disk("s3")->url(' + this.user.avatar + ')' }}"> 

オプション2 - Laravelルート

は、あなたに

Route::get('api/my-avatar', UserController@getAvatar') 

のようなものを簡単なルートを作成します。 UserController

public function getAvatar() 
{ 
    return Storage::disk("s3")->url(auth()->user()->avatar); 
} 

とそのルートをaxiosから呼び出します。