YbCodemirrorSql SQL编辑器
在 yb-codemirror 基础上使用 sql 语言,并且内置格式化 sql 按钮
lang 属性内部对应 是 @codemirror/lang-sql 中的 dialect:
{
SQL: StandardSQL,
MYSQL: MySQL,
POSTGRESQL: PostgreSQL,
STARROCKS: StandardSQL,
DORIS: StandardSQL,
CLICKHOUSE: StandardSQL,
ORACLE: StandardSQL,
SQLSERVER: StandardSQL,
DB2: StandardSQL,
VERTICA: StandardSQL,
}
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
# 基本用法
复制
# 固定布局高度
复制
# 可自适应文本高度
通过设置 autosize
属性,指定最小行数和最大行数,可以使得编辑器的高度能够根据内容自动进行调整。
启用
复制
# 在光标处插入内容
复制
通过 this.$refs['codemirror'].getEditorView()获取到编辑器实例以及 extensions 扩展属性,查看codemirror 的文档 (opens new window),实现更多复杂的操作功能
# 使用 getSqlExtensions 增强编辑器语法提示
复制
# YbCodemirrorSql Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
value/v-model | 绑定值 | string | -- | -- |
lang | SQL 语言的类型 | string | -- | SQL |
showFormatBtn | 显示格式化按钮 | boolean | -- | true |
getSqlExtensions | 可以取的 languageDialects 再返回 extensions | function(languageDialects){return extensions} | -- | -- |
其他属性同 YbCodemirror | -- | -- |
# YbCodemirrorSql Methods
方法名称 | 说明 | 参数 | 返回值 |
---|---|---|---|
其他属性同 YbCodemirror | -- |
# YbCodemirrorSql Events
方法名称 | 说明 | 参数 | 返回值 |
---|---|---|---|
其他属性同 YbCodemirror | -- | -- |
上次更新: 2023/12/21, 17:38:27