Tui editor富文字編輯器的使用

tui.editor（toast ui editor）是一款所見即所得的markdown編輯器。toast ui editor提供markdown模式和wysiwyg模式。它的功能非常強大，你可以編輯**，uml圖和圖表等。

1、安裝tui.editor

使用  mpn i tui-editor -s 

2、新建tuieditor.vue檔案，內容如下

<

template
>
<
div 
id="editorsection"
>
div>
template
>
<
script
>
import editor from 
"tui-editor"; 
/*es6 
*/import 
"tui-editor/dist/tui-editor.css"; 
//editor's ui
import 
"tui-editor/dist/tui-editor-contents.css"; 
//editor's content
import 
"codemirror/lib/codemirror.css"; 
//codemirror
import 
"highlight.js/styles/github.css"; 
//code block highlight
export 
default
,  mounted() ,
beforedestroy() ,
methods: );
this
.tuieditor.gethtml();}}
}};script
>
<
style
>
style
>

3、再其他的vue檔案中引用，內容如下

<

template
>
<
mytuieditor 
v-model
="content"
ref="myquilleditor"
>
mytuieditor
>
template
>
<
script
>
//tuieditor富文字編輯器
import mytuieditor from 
"./components/tuieditor.vue"; 
//匯入tuieditor富文字編輯器元件
export 
default
,  data() ;
}};script
>
<
style 
scoped
>
style
>

富文字編輯器

關於使用富文字編輯器的一些小坑 官網 1.專案 片 editor fail function xhr,editor,result custominsert function insertimg,result,editor this.editor.create this.editor.txt.html...

富文字編輯器

富文字編輯器，rich text editor,簡稱 rte,它提供類似於 microsoft word 的編輯功能。常用的富文字編輯器 kindeditor ueditor ckeditor 在頁面中新增js 用於初始化kindeditorallowfilemanager 是否允許瀏覽伺服器已上傳...

富文字編輯器

富文字編輯器，rich text editor,簡稱 rte,它提供類似於 microsoft word 的編輯功能。常用的富文字編輯器 kindeditor ueditor ckeditor 在頁面中新增js 用於初始化kindeditor allowfilemanager 是否允許瀏覽伺服器已上...