Văn bản hành động trong Rails 6

Tram Ho

Giới thiệu

Action text là tình năng mới trong Rails 6 được sử dụng để tạo Rich text. Action text này dựa trên Trix editor là WYSIWYG editors chứa đầy đủ chức năng của editor bao gồm text formatting, tạo lists, embedded images, attachments …

Content tạo ra từ Action text này sẽ được lưu trong RIchText model riêng và các embedded images là tự động lưu sử dụng Active Storage và có quan hệ với RichText model.

Cài đặt

  • Run rails action_text:install để add Yarn package và tạo migration cần thiết.

  • Cài đặt Active Storage : dùng cho images và các attachments khác

  • Run migration

  • trong application.js, add code dưới:

trong actiontext.scss, add code dưới :

  • trong application.scss, add code dưới :

Đến đây là xong bước cài đặt. Tiếp theo sẽ là ví dụ để demo cách sử dụng Action Text

Ví dụ Demo

Ví dụ này chỉ đơn giản là đăng một bài post (title và content).

  • Generate model

Note: Chúng ta chỉ cần add column title cho Post model thôi, còn column content sẽ handle bởi action text.

  • Modify Post model như sau

  • Helper rich_text_area sẽ dùng để render editor. Từ đó sẽ tạo được form như sau:

  • Hiện thị rich text đó như sau:

  • Để lưu rich text content, params sẽ phải permit attribute :content :

Đến đây là chúng ta đã hiểu được về cách sử dụng basic nhất của actiion text rồi. Để tìm hiểu sâu hơn, hãy tìm hiểu links sau:

https://edgeguides.rubyonrails.org/action_text_overview.html

https://gorails.com/episodes/how-to-use-action-text

https://www.freecodecamp.org/news/quick-look-at-action-text-in-rails-6-0-12a8f9f7597f/

https://medium.com/@abhishek.kanojia/action-text-for-rails-6-92a9be7498bd

Chia sẻ bài viết ngay

Nguồn bài viết : Viblo