我的rails博客的搭建過(guò)程中,感覺(jué)最開(kāi)始寫(xiě)的的輸入框是在是太丑了,然后發(fā)現(xiàn)網(wǎng)上有對(duì)rails非常友好的kindeditor編輯器。所以本著DRY原則,放到自己的項(xiàng)目中。
一. 安裝kindeditor一共五步走。
- 第一步,將對(duì)應(yīng)的gem放到自己的gemfile文件中。
gem 'rails_kindeditor'
- 第二步,更新gem依賴
bundle install
- 第三步,安裝對(duì)應(yīng)的gem組件
rails g rails_kindeditor:install
- 第四步,將kindeditor對(duì)應(yīng)的文件放到自己app/assets目錄下
rails kindeditor:assets
- 更新自己的html.erb文件
將原來(lái)的
<%= f.text_field :content %>
改成
<%= f.kindeditor :content ,:window_onload => true %>
以上正式教程就結(jié)束了,看一下效果。
二. 安裝過(guò)程中可能碰見(jiàn)的一個(gè)bug
看起來(lái)安裝過(guò)程很簡(jiǎn)單,但是實(shí)際上我在使用的時(shí)候碰到的一個(gè)問(wèn)題:沒(méi)有找到app/assets目錄下的kindeditor。具體顯現(xiàn)出來(lái)的問(wèn)題是我們的界面和之前的沒(méi)有什么變化。
最后發(fā)現(xiàn)問(wèn)題癥結(jié)在我們的kindeditor的js文件并沒(méi)有添加到我們的項(xiàng)目中。
解決措施是在app/assets/javascripts/application.js中添加一句話
//= require kindeditor
然后重新啟動(dòng)一下你的服務(wù)器就可以了。
三. 顯示的時(shí)候出現(xiàn)不能正常顯示的問(wèn)題
bug描述我們將內(nèi)容保存到數(shù)據(jù)庫(kù)中之后,等我們想顯示的時(shí)候,我們發(fā)現(xiàn)得到的竟然是帶有html標(biāo)簽的文本,而不是我們想象中的對(duì)應(yīng)格式的文件。
bug原因是rails有自我保護(hù)機(jī)制,當(dāng)判斷我們的string中有<和>等標(biāo)簽時(shí),他會(huì)自己轉(zhuǎn)義。看一下下面的例子
<h1> this is a passage for rails </h1>
會(huì)被rails轉(zhuǎn)移為下面格式的語(yǔ)言
<h1>
this is a passage for rails
</h1>
可以清晰的看到,被轉(zhuǎn)義了。
bug修復(fù)
將我們之前的
<%= @post.content %>-->
改成
<!--方法一-->
<%= @post.content.html_safe %>
或者
<!--方法2-->
<%= raw @post.content %>
解決原理 就是講我們的string設(shè)置為可信任的從而不轉(zhuǎn)義,從而能夠正常顯示。
以上,大家繼續(xù)加油!