New to Kendo UI for Vue? Start a free 30-day trial
Editor
Represents the Kendo UI for Vue Editor component.
<template>
<div>
<Editor
:tools="tools"
:content-style="{
height: '690px',
}"
:default-content="content"
/>
</div>
</template>
<script>
import { Editor } from "@progress/kendo-vue-editor";
import content from "./content-overview";
export default {
components: {
Editor,
},
data() {
return {
tools: [
["Bold", "Italic", "Underline", "Strikethrough"],
["Subscript", "Superscript"],
["AlignLeft", "AlignCenter", "AlignRight", "AlignJustify"],
["Indent", "Outdent"],
["OrderedList", "UnorderedList"],
"FontSize",
"FontName",
"FormatBlock",
["Undo", "Redo"],
["Link", "Unlink", "InsertImage", "ViewHtml"],
["InsertTable"],
["AddRowBefore", "AddRowAfter", "AddColumnBefore", "AddColumnAfter"],
["DeleteRow", "DeleteColumn", "DeleteTable"],
["MergeCells", "SplitCell"],
],
content: content,
};
},
};
</script>props Readonly<EditorProps
The props of the Editor component.
contentElement HTMLDivElement
Returns the content-editable DOM element of the Editor.
element HTMLElement
Returns the DOM element of the Editor.
value Node | string
The value of the Editor.
view EditorView<any>
Returns the view object of the Editor.
