画像アップロード機能

マイグレーションファイルを作る

$ rails g migration AddPictureToPlaces picture:string

code: 20190523134450_add_picture_to_places.rb

def change

add_column :places, :picture, :string

end

end

マイグレーションファイルから DB を更新する

$ rails db:migrate

Gem を追加する

code: Gemfile

gem 'carrierwave'

追加

$ bundle

install 省略可能

$ bin/spring stop

一応でキャッシュの仕組みを再起動している

$ rails g uploader Picture

carrierwave を利用するために必要なファイルを生成している

モデルの変更

code:app/models/place.rb

class Place < ApplicationRecord

mount_uploader :picture, PictureUploader # 追加

end

コントローラの変更

code:app/controllers/places_controller.rb

...

def place_params

params.require(:place).permit(:date, :weather, :place, :memo, :picture) # :picture 追加

end

ビューを修正する

追加する

code:app/views/places/_form.html.erb

<div class="field">

<%= form.label :picture %>

<%= form.file_field :picture %>

</div>

https://gyazo.com/655f125d78d8930069513469d4e61b4a

code:app/views/places/show.html.erb

<p>

<strong>画像:</strong>

<%= image_tag(@place.picture_url) if @place.picture.present? %>

</p>

詳細ページ

画像の表示

code:app/views/places/index.html.erb

<td class="small-text"><%= place.picture %></td>

一覧ページ

画像のパスの表示