(五) 文章編輯頁開發

一念輪迴發表於2018-08-08

修改views/post/form.vue檔案,引入mavonEditor

import { mavonEditor } from "mavon-editor";
複製程式碼

然後在template中使用<mavon-editor></mavon-editor>

詳細配置可檢視 mavonEditor 文件

頁面效果如下圖:

(五) 文章編輯頁開發

標題設定

可使用muse-uitext-field元件,通過覆蓋mavon-editor樣式,使其出現在指定位置。 注意:標題覆蓋到編輯器後,會使編輯器選單裡的標題和檔案上傳下拉選單,出現在標題下面,需要修改覆蓋整個編輯器的position樣式屬性,並且調整標題的z-index的值,使工具欄>標題>內容

文章儲存修改刪除

可以通過vuex來觸發儲存操作,直接呼叫後端介面api來實現。

(五) 文章編輯頁開發
部落格地址: alibt.top

更多精彩,請關注我的公眾號!

相關文章