ERBの中でlink_toを用いて外部サイトへのリンクを生成する際に、URLにRubyのコードを埋め込んで動的に変化させたかったのですが、やり方がわからなかったため、備忘録としてまとめます。
バージョン
- Ruby 3.0.3
- Rails 6.1.6.1
記事の信頼性
- ぼくは独学で未経験から従業員300名以上の自社開発企業へ転職しました。
- 実務ではVue.jsとRailsを毎日書いています。
- 初心者や駆け出しエンジニアがつまづくポイントも身をもってよく理解しています。
目次
問題
もともとは次のようなコードで静的なリンクが実装されていました。（リンク先は外部サイトの想定です）
<div class="categories">
<ul>
<% @categories.each do |category| %>
<li><%= link_to category.name, "https://sample-app.com/articles/faq/categories/1", target: '_blank', rel: 'noopener noreferrer' %></li>
<% end %>
</ul>
</div>URL末尾の1の部分をcategory.idの値に変更してリンクの遷移先を動的に変えたかったのですが、やり方がわかりませんでした、、。
解決策
結論として、以下のように書けばOKです。
<div class="categories">
<ul>
<% @categories.each do |category| %>
<li><%= link_to category.name, "https://sample-app.com/articles/faq/categories/#{category.id}", target: '_blank', rel: 'noopener noreferrer' %></li>
<% end %>
</ul>
</div>#{}で囲むことで、Rubyのコードを埋め込んでリンクを動的に変化させることができました。
おわりに
ふだんはVue.jsでフロントエンド開発をすることが多く、ERBには不慣れなので逆に苦戦しました。
コメント