monaco-plus
v1.0.1
Published
1. 封装组件安装的webpack插件,方便引用 2. 支持sql语言的库、表、字段提示功能 3. 支持sql语言格式化功能 4. 支持错误提示
Downloads
2
Readme
已实现功能
- 封装组件安装的webpack插件,方便引用
- 支持sql语言的库、表、字段提示功能
- 支持sql语言格式化功能
- 支持错误提示
使用步骤
// 安装
npm i monaco-plus
// 引用1
import monacoPlus from 'monaco-plus'
Vue.use(monacoPlus)
or
// 引用2
import {monacoPlus} from 'monaco-plus'
export default {
components: {
"monaco-plus": monacoPlus,
},
...
}
// 使用
<monaco-plus
class="editor"
ref="editorRef"
:options="{ value: sqlStr }"
></monaco-plus>
自定义参数
// 注:其中options参数为monaco原生配置参数
// options中加入自定义配置如下:
options: {
sqlFuns: {
getDBNames, // 数据库名字
getTableNamesByDBName, // 获取数据表
getColumnNamesByTableName, // 获取字段名
getMarkers, // 错误提示 其中
}, // 自定义sql提示的回调函数
isSql: true, // 自定义sql提示开关
}
type Marker = {
startLineNumber: 1, // 开始的行号,注:行号列号都从1开始
startColumn: 1, // 开始的列号
endLineNumber: 1, // 结束的行号
endColumn: 5, // 结束的列号
message: "拼写错误", // 错误信息
severity: monaco.MarkerSeverity.Error, // 错误级别枚举值
}
|方法名|入参|出参|说明| | ---- | ---- | ---- | ---- | |getDBNames|-|Array[String] 数据库名字的数组|数据库名字| |getTableNamesByDBName|dbName:String 数据库名字|Array[String] 数据表名字的数组|根据库名获取数据表| |getColumnNamesByTableName|tableName:String 数据表名字|Array[String] 字段名字的数组|根据表名获取字段名| |getMarkers|sqlStr:String sql的每行的数据通过\n拼串|Array[Marker] Marker类型的数组|错误提示|