Ruby on Rails で rich_text_filed と rich_text_area の違い

Question

参考のサイトの通りに rails の　actiontext という機能を使いたいと思っているのですがこのサイトの通り　rich_text_filed としたら以下のエラーが出ます

undefined method `rich_text_filed' for #<ActionView::Helpers::FormBuilder:0x00007fa9b5822790>
Did you mean?  rich_text_area

         <%= form_with(url: posts_create_path) do |form|%>
         <div class="field">
           <%= form.rich_text_filed:title %>
         </div>
         <% end %>

対象のコードは以下の通りです。

<div class="main posts-new">
  <div class="container">
    <h1 class="form-heading">質問する</h1>
    <%= form_tag("/posts/create") do  %>
      <div class="form">
        <div class="form-body">
          <% @post.errors.full_messages.each do |message| %>
           <div class="form-error">
             <%= message %>
           </div>
         <% end %>
         <textarea name="title"><%= @post.title %></textarea>
         <%= form_with(url: posts_create_path) do |form|%>
         <div class="field">
           <%= form.rich_text_filed:title %>
         </div>
         <% end %>

          <input type="submit" value="質問する">
        </div>

      </div>
    <% end %>
  </div>
</div>

そしてエラーコードの通りに　rich_text_area とするとエラーは出ないのですが、actiontext は表示されないかつ、ただの小さな四角いテキストエリアだけ出ます
rich_text_filed と　rich_text_area の違い、とactiontext を導入できない原因はなんでしょうか？
参考のリンクを見ていただけたら幸いです！

Answer 1

rich_text_filed と　rich_text_area の違い

参照されているQiitaの記事の間違いかと思います。
正しくは rich_text_area なので、違いは気にする必要はないかと思います。
(Qiita記事中の動画内でもrich_text_area と書いてました)

actiontext を導入できない原因はなんでしょうか？

詳細情報がないので、なんとも原因特定が難しいのですが、
エラーが出ない かつ、 四角いテキストエリアだけ出るところから推測すると、
JavaScript側のエラーかなにかだとは思いますが、そのあたりでエラーログが出ていたりしないでしょうか?

Comments

[atage517]

ducci さん　rich_text_area の件については了解しました。

post/new アクションのページではエラーが出ていなくactiontextも表示されていない状況なのですが、post/indexアクションや他のページをクリックすると以下のエラーが出ます。　ですが　actiontextを導入する前にはエラーがなかったのでactiontextのなんらかの原因でエラーが出ていると思われます。

ActionView::Template::Error (undefined method `truncate' for #<ActionText::RichText:0x00007fa9b7afadf8>
Did you mean? trust):
36: <div class="post-content">
37: <%= link_to(post.title.truncate(78), "/posts/#{post.id}", {class: "text-weight"})%>
38: <br>
39: <%= link_to(post.content.truncate(108, omission: '...もっと見る'), "/posts/#{post.id}") %>
40: </div>
41: <div class="post-menus">
42: <div class="post-menus-right">

[atage517]

JavaScriptの方も特にエラーは出ていないですね。参考にしたサイトの通りやったので自分では一切手を加えていないです。

application/js

require("rails-ujs").start()
require("trix")
require("@rails/actiontext")

applicaition/html.erb

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application' %>