vue 使用ckeditor5

1、安裝

官網(wǎng)地址：https://ckeditor.com/ckeditor-5/download/

下載版本需要的版本

還要下載@ckeditor/ckeditor5-vue npm install --save?@ckeditor/ckeditor5-vue

如果你沒下@ckeditor/ckeditor5-vue，那么就不能直接用ckeditor vue的組件?

2、使用 【以@ckeditor/ckeditor5-build-decoupled-document為例子】

main.js 文件內(nèi)加入

import CKEditorfrom '@ckeditor/ckeditor5-vue';

Vue.use( CKEditor );

組件下例子

<template>

<div>

<ckeditor :editor="editor" @ready="onReady" v-model="content" :config="editorConfig"></ckeditor>

</div>

</template>

需要中文就要引入這個包

import '@ckeditor/ckeditor5-build-decoupled-document/build/translations/zh-cn'

import DecoupledEditor from '@ckeditor/ckeditor5-build-decoupled-document';

第一次用這個編輯器，沒發(fā)現(xiàn)有代碼塊的功能，所以直接截圖

data

data 截圖

method

method 截圖

由于網(wǎng)絡上有關參考ckeditor5文章甚少，全部依靠看文檔，目前整理一遍簡單的用法供大家參考，高級plugins用法還在學習中，有什么不對的地方希望大家指正。ps：剛學html不久，還要學習js、css、less、node、php等。歡迎大家多多交流,Q57875160。不是交流的請不要加。