2.1.5 • Published 5 years ago
vue-ckeditor2 v2.1.5
vue-ckeditor
Ckeditor using for Vue.js 2
Requirements
Install
CDN
<script src="https://unpkg.com/vue-ckeditor2"></script>
NPM
$ npm install vue-ckeditor2 --save
Usage
This document applies to v2.0+. If you are looking for older versions, docs are here
Component
Then in your component:
<template>
<div>
<vue-ckeditor
v-model="content"
:config="config"
@blur="onBlur($event)"
@focus="onFocus($event)"
@contentDom="onContentDom($event)"
@dialogDefinition="onDialogDefinition($event)"
@fileUploadRequest="onFileUploadRequest($event)"
@fileUploadResponse="onFileUploadResponse($event)" />
</div>
</template>
<script>
import VueCkeditor from 'vue-ckeditor2';
export default {
components: { VueCkeditor },
data() {
return {
content: '',
config: {
toolbar: [
['Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript']
],
height: 300
}
};
},
methods: {
onBlur(evt) {
console.log(evt);
},
onFocus(evt) {
console.log(evt);
},
onContentDom(evt) {
console.log(evt);
},
onDialogDefinition(evt) {
console.log(evt);
},
onFileUploadRequest(evt) {
console.log(evt);
},
onFileUploadResponse(evt) {
console.log(evt);
}
}
};
</script>
Props
Name | Type | Description |
---|---|---|
name | String | Name of instance ckedior. Default: editor- |
id | String | Id of instance ckedior. Default: editor-1 |
types | String | Types of ckedior. Default: classic |
config | Object | All configuration of ckeditor. Default: {} |
instanceReadyCallback | Function | Optional function that will be attached to CKEditor instanceReady event. |
readOnlyMode | Boolean | Option setReadOnly editor initializes in the proper mode. Default: false |
Events
Name | Description |
---|---|
blur | Fired when the editor instance loses the input focus. |
focus | Fired when the editor instance receives the input focus. |
contentDom | Event fired when the editor content (its DOM structure) is ready |
dialogDefinition | Event fired when a dialog definition is about to be used to create a dialog into an editor instance |
fileUploadRequest | Event fired when the file loader should send XHR |
fileUploadResponse | Event fired when the file loader response is received and needs to be parsed |
Build Setup
You can use vue-cli with vue-rollup-boilerplate templates or other vue templates
Created By
Thanks to:
- Eduárd Moldován
- Dominique FERET
- comfuture
- 旺旺
- Tony Yip
- Nedyalko Dyakov
- Bryan Miller
- Jeff Omiecinski
- rlfscin
- Renato Souza
- Fernando Morgenstern
- Christoph-Wagner
- Patrick Davey
- Michali Sarris
License
MIT © Dang Van Thanh
2.1.5
5 years ago
2.1.4
5 years ago
2.1.3
5 years ago
2.1.2
5 years ago
2.1.1
6 years ago
2.1.0
6 years ago
2.0.10
6 years ago
2.0.9
6 years ago
2.0.8
6 years ago
2.0.7
6 years ago
2.0.6
6 years ago
2.0.5
6 years ago
2.0.4
6 years ago
2.0.3
6 years ago
2.0.2
6 years ago
2.0.1
6 years ago
2.0.0
6 years ago
1.26.0
6 years ago
1.25.0
6 years ago
1.24.0
6 years ago
1.23.0
6 years ago
1.22.0
6 years ago
1.21.0
6 years ago
1.20.0
6 years ago
1.19.0
6 years ago
1.18.0
6 years ago
1.17.0
7 years ago
1.16.0
7 years ago
1.15.0
7 years ago
1.14.0
7 years ago
1.12.0
7 years ago
1.11.0
7 years ago
1.10.0
7 years ago
1.0.9
7 years ago
1.0.8
7 years ago
1.0.7
7 years ago
1.0.6
7 years ago
1.0.5
7 years ago
1.0.4
7 years ago
1.0.3
7 years ago
1.0.2
7 years ago
1.0.1
7 years ago
1.0.0
7 years ago