10
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【Laravel】DBの値をもとにViewに画像を表示させる

Last updated at Posted at 2019-12-28

Laravelで、DBの値をもとにViewに画像を表示させる方法です。

やりたいこと

DBの値(=流動的)をもとにViewに画像を表示させる
image.png

環境

  • PHP:バージョン7.3.7
  • Laravel:バージョン5.8
  • OS:Windows10

画像表示のキホン

画像ファイルは外部ファイルにあたり、{laravelプロジェクト}/publicに置く必要があります。
他、CSSやJavascriptも同様。

image.png

public配下のimageディレクトリ内の画像を表示させたい場合、Bladeでの記述は以下のようになります。

<img src="{{ asset('image/hoge.png') }}" alt="hoge.png"> 

Laravelのヘルパ関数のひとつ、asset関数を用いるのがポイント!

DBの値をもとに表示させるには

barsテーブルから取得したデータ$barのPICTUREの値をもとに画像を表示させたい場合はBladeには以下のように記述します。
※画像は上記同様、public配下のimageディレクトリ内に配置。

<img src="{{ asset('image/' . $bar->PICTURE) }}" alt="{{ $bar->PRODUCT }}"> 

固定値(=imageディレクトリ)はクオーテーションで囲い、「.」で変数(=DBから取り出した画像名)と連結させます。
記述の仕方を間違えるとうまく表示されないので、注意しましょう!

参考

10
14
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?