JCodeEditor

JCodeEditor 代码编辑器组件

一个简易的代码编辑器，支持语法高亮。

代码演示

<template>
	<div>
    <j-code-editor
      style="min-height: 100px"
      language="javascript"
      :fullScreen="true"
      v-model="editorValue"
    />
    {{ editorValue }}
  </div>
</template>
<script>
	export default {
    data() {
      return {
        form: this.$form.createForm(this),
        editorValue: ''
      }
    }
  }
</script>

api

props

属性	说明	类型	必填	默认值
language	代码语言类型	string
languageChange	是否显示切换语言类型	boolean		false
placeholder	默认文字	string
lineNumbers	是否显示行号	boolean		true
fullScreen	是否显示全屏按钮	boolean		false
zIndex	全屏后的z-index	number | string		999
autoHeight	是否自适应高度，string只能填写'!ie'	boolean | string		true
height	固定高度	string | number		'240px'

事件

事件名称	说明	回调参数
input	输入内容变化时调用	function(code)
language-change	修改语言类型时调用	function(language)

支持的代码类型

• 'css'
• 'javascript'
• 'html'
• 'x-java'
• 'x-objectivec'
• 'x-python'
• 'x-rsrc'
• 'x-sh'
• 'x-sql'
• 'x-swift'
• 'x-vue'
• 'markdown'