`

API

vditor-react maps most of its props into options of the original Vditor APIs, which you can access here (Chinese version only).

vditor-react also provides some props to improve the React practice, which are as follow:

| Name | Definition | Default | Description | Deprecated Vditor API |
|----------|-----------------------------------------|----------|------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------|
| onInit | (text: String) => {} | () => {} | Called after the editor UI has been loaded, with the initial text. | options.after |
| onSelect | (selection: String, text: String) => {} | () => {} | Called when the text selection is updated, with the selected text and the full text. | options.select |
| onInput | (text: String) => {} | () => {} | Called shortly after text inputs, with the full text. It won’t be called during an IME composition. | options.input |
| darkMode | Boolean | false | Whether the editor UI is in dark mode. | options.theme |
| disabled | Boolean | false | Whether to disable the editor. | disabled() enable() |

You can also extend this component and access the Vditor instance as this.editor.

Example

There is a demo under demo/ with full functionalities of vditor-react, and it also implements system-wide (browser-wide) Dark Mode support and an 'Enable/Disable' switch with React Hooks.

You can start the demo by the following command:

`bash
npm run dev
`

Then open the browser and check it out in http://127.0.0.1:8081`.