codemirror / vue-codemirror 插件 使用总结

1、安装vue-codemirror

npm install vue-codemirror --save

2、在main.js中引入

import { codemirror } from 'vue-codemirror'

import 'codemirror/lib/codemirror.css'

Vue.use(codemirror)

3、在使用的组件中引入codemirror

import { codemirror } from 'vue-codemirror'

import 'codemirror/mode/sql/sql.js' //我主要是想高亮sql语句，如果是其他的语言，则引入相应的js

 

this.$refs.cmExpressionsRef.codemirror.getValue() // 取得编辑器的值
this.$refs.cmExpressionsRef.codemirror.focus() // 取得编辑器焦点
this.$refs.cmExpressionsRef.codemirror.setCursor(2,4)  // line:0-~ 哪一行, ch: 哪个字节
this.$refs.cmExpressionsRef.codemirror.getCursor() // line:0-~ 哪一行, ch: 哪个字节
getRange(from: {line, ch}, to: {line, ch}, ?separator: string) → string // 获取编辑器中给定点之间的文本