MaterializeのToastsをRailsに適用させる。

最近は、てっきりMaterializecssを使ってRailsで開発してます。いや美しいデザインが手軽にできて素晴らしいですね。

RailsでのToastはtoastrを使うことが多いですが、今回はMaterializecssのデフォルトtoastを使用します。

事前準備はできてるとして進めます。

導入はできていて、deviseを導入済みとします。

やることは簡単。

_massege.html.erbを作成。

名前はなんでもいいです。自分は、_navbar.html.erbなどなどが入ってるshardフォルダに作成しました。

以下のコードを書きます。

_massege.html.erb

<% unless flash.empty? %>
  <script type="text/javascript">
    <% flash.each do |key, value| %>
      M.toast({html: '<%= value %>'})
    <% end %>
  </script>
<% end %>

フラッシュのvalueをmaterializecssで用意されている型にはめ込むだけです。

/views/layouts/application.html.erbのbody内に追記。

<%= render 'shared/message' %>

あとはこれを追記して完成。なんとも簡単にできました。