つまりどころ
vue.jsの仕様のひとつにv-modelのついたformの初期値とvalueを無視するというのがある。railsのviewから値を渡す際にいつもview内で変数を初期値に設定してhiddenで隠し、まとめて渡すことでユーザーが入力しない情報(例えばどこのページかuser_idなど)を渡していた。そのため渡す方法を探していたのだがやっといい方法が見つかったのでメモ。
pure jsで渡す
inputの場合
vue.jsはpure jsもかけるのでpure jsでformを通してviewからjsファイルに渡す。
form.erb
<input type="text" id="form_board_id" value="<%= @post.id %>" class="hidden">
form.js
var form_board_id = document.getElementById("form_board_id").value;
これで渡せる。
document.が全体を探し出すという意味でgetElementByIdがカッコ内のidのついたformの値を受け取る。それを.valueで値に変換している。
textareaの場合
なぜかtextareaの場合はvalueに値を入れても飛ばせなかった。
form.erb
<textarea class="hidden" id="form_board_id"><%= @post.id %></textarea>
form.js
var form_board_id = document.getElementById("form_board_id").value;