x-ace-editor.vue

XAceEditor

示例

基本用法

<x-ace-editor></x-ace-editor>

设置语言和主题

<template>
<x-ace-editor v-model="value" lang="json" theme="monokai"></x-ace-editor>
</template>
<script>
import 'brace';
import 'brace/mode/json';
import 'brace/theme/monokai';
 
export default {
    data() {
        return {
            value:
`{
    "name": "Alice",
    "age": 24,
    "phone": "18612345678"
}
`,
        };
    },
}
</script>

禁用

<x-ace-editor value="var i = 0;" disabled></x-ace-editor>

API

Props/Attrs

Prop/Attr	Type	Default	Description
value.sync, v-model	Any		当前选择的值
lang	String	'text'	设置语言
theme	String		设置主题
readonly	Boolean	false	是否只读
disabled	Boolean	false	是否禁用
options	Object		配置项对象
autofocus	Boolean	false	默认focus状态