# Controlled Mode

By default, the Editor is in an uncontrolled mode.

## Controlling the Value

To manage the value of the Editor:

1. Use its [`value`](https://www.telerik.com/kendo-vue-ui-develop/components/editor/api/editorprops#value) property.
2. Handle the [`onChange`](https://www.telerik.com/kendo-vue-ui-develop/components/editor/api/editorprops#onchange) event.
3. Pass the new value through the props.

The following example demonstrates how to control the value of the Editor.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/editor/controlled-value-doc/source.txt)

## Using String Value

The Editor's [`value`](https://www.telerik.com/kendo-vue-ui-develop/components/editor/api/editorprops#value) property can also be a string. The HTML representation of the Editor's document needs to be obtained by the [`html`](https://www.telerik.com/kendo-vue-ui-develop/components/editor/api/editorchangeevent#html) getter of the onChange event object.

The following example demonstrates how to use a string value of the Editor.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/editor/controlled-value-string/source.txt)

## Using Uncontrolled Mode

To utilize the Editor in uncontrolled mode, use its [`defaultContent`](https://www.telerik.com/kendo-vue-ui-develop/components/editor/api/editorprops#defaultcontent) prop to set initial HTML and the editor's instance to get the edited HTML. [See example](https://www.telerik.com/kendo-vue-ui-develop/components/editor/content).

## Suggested Links

* [API Reference of the Editor](https://www.telerik.com/kendo-vue-ui-develop/components/editor/api/editorprops)
* [Editor's value/document object](https://prosemirror.net/docs/guide/#doc)
