0
0

More than 3 years have passed since last update.

[未経験エンジニア]のオリジナルアプリ制作の反省5. local: trueはなぜ書くのか

Last updated at Posted at 2021-02-09

今回書くこと

form_withに記述するlocal: trueはなぜ記述するのか

環境

Ruby 2.6.5
Ruby on Rails 6.0.4.3

結論

local: trueを記述する理由は、form_withにデフォルトで搭載されているremote: trueを打ち消し、同期通信にするため。

form_withとは、と少し解説

form_withは、Railsのビューの拡張子としてerbを選択した時に用いる事ができる、フォームを作成するヘルパーメソッドです。ちなみに、ERB(Embedded Ruby)は、htmlやjsといった拡張子の後ろにくっつく事で、rubyのコードを実行できるファイルを生成できます。

Railsガイドによると、

Action Viewのテンプレートはさまざまな方法で記述することができます。テンプレートの拡張子が.erbであれば、ERB (ここにRubyのコードが含まれます) とHTMLが含まれます。

とのことなので、例えば

index.html.erb
<h1>このファイルには、rubyのコードを実行できる土台があります。</h1>
<%= form_with model: @example, local: true do |f|%>
  <%= f.text_area :title>
<% end %>
<h2>このように、htmlの要素の中にrubyのコード(ヘルパーメソッド)を組み込む事ができます。</h2>

の、ように記述する事ができます。

本題

さて、本題です。
先ほどのコードをもう一度見てみましょう。

index.html.erb
<h1>このファイルには、rubyのコードを実行できる土台があります。</h1>
<%= form_with model: @example, local: true do |f|%>
  <%= f.text_area :title>
<% end %>
<h2>このように、htmlの要素の中にrubyのコード(ヘルパーメソッド)を組み込む事ができます。</h2>

2行目に、何気なく、local: trueと書いてあります。これはなんでしょうか?

結論で述べましたが、これはremote: trueを打ち消すものです。
では、remote: trueとはなんでしょうか?

remote: true

これは、「非同期通信を可能にする」ためのオプションです。非同期通信というのは、簡単にいうとブラウザをリロードしなくてもデータの更新だったりなんなりができる仕組みのことです。

実は、このremote: trueは、form_withにデフォルトで備わっています。つまり、form_withを用いて入力されたデータは、local: trueを書かない限り、勝手に非同期通信になるということです。なぜこうなるかはわかりません。

逆に、remote: trueをオプションとして付与することで、非同期通信が可能になります。例えば

link.html/erb
<%= link_to "記事を削除", @article, remote: true, method: delete %>

とすれば、削除を非同期通信で行うことができます。

(余談ですが)

form_withがrialsに導入されたのは、ver 5.1からみたいですね。それ以前は、form_forとform_tagというのを状況に応じて使い分けていたようです。

こちらの記事によると、

これまで、フォームを作りたいときで、関連するモデルがなかったときは form_tag を使ってきました。
そして、モデルがあったときは form_for を使ってきました。

とあります。この両方の機能が一つになったのが、form_withです。

最後に

最後まで読んでいただき、ありがとうございます。
ソースコード、記事の書き方について「もっとこうしたほうがいいよ!」というご意見、「そこどうなっているの?」というご質問など、お待ちしております。

参考文献

0
0
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
0
0