Vue Ceditor 組件是一個(gè)基于 Vue.js 開發(fā)的 Markdown 編輯器組件。該組件可以方便地將 Markdown 格式的文本轉(zhuǎn)換成 HTML，并支持實(shí)時(shí)預(yù)覽功能。下面是一個(gè)基礎(chǔ)的使用示例：

<template>
<div>
<vue-ceditor v-model="content"></vue-ceditor>
<div v-html="compiledContent"></div>
</div>
</template>
<script>
import VueCeditor from 'vue-ceditor'
export default {
components: { VueCeditor },
data() {
return {
content: '',
compiledContent: ''
}
},
watch: {
content: function(val) {
this.compiledContent = marked(val)
}
}
}
</script>

上面的代碼中，我們首先引入了 VueCeditor 組件，并使用 v-model 綁定了內(nèi)容的數(shù)據(jù)模型。然后通過調(diào)用 marked 函數(shù)將 Markdown 文本轉(zhuǎn)成 HTML，賦值給 compiledContent 屬性，并在模板中使用 v-html 屬性將其渲染出來。

VueCeditor 提供了多種配置選項(xiàng)，可以對其外觀和行為進(jìn)行個(gè)性化設(shè)置。比如，我們可以設(shè)置簡潔模式，只顯示編輯器文本框，并隱藏預(yù)覽區(qū):

<template>
<div>
<vue-ceditor v-model="content" :simple="true"></vue-ceditor>
</div>
</template>

除此之外，VueCeditor 還支持快捷鍵設(shè)置、圖片上傳等高級功能，更多信息請參考官方文檔。