sql-formatter -- 格式化sql数据
首先你须要一个可以展示代码的组件;我利用的是tech-ui(内部组件库);
你如果没有类似的组件,可以参考以下链接替代:
react-monaco-editor -- 代码编辑器(适用Umi)_umi monaco editor-CSDN博客
Codemirror -- 代码编辑器(react、umi)_codemiror-CSDN博客
第一种 :后端处置惩罚过的数据
import { Highlight } from '@alipay/tech-ui';
const sqlValue = " SELECT\\ntrisk_adm.mid_qat_sct_baseline_sigma.clustername, trisk_adm.mid_qat_sct_baseline_sigma.namespace, trisk_adm.mid_qat_sct_baseline_sigma.configsource, trisk_adm.mid_qat_sct_baseline_sigma.configkey\\n \\n FROM trisk_adm.mid_qat_sct_baseline_sigma\\n WHERE 1=1AND trisk_adm.mid_qat_sct_baseline_sigma.dt = '20240318' "
const sqlFormat = (text : string) => {
if (!text) return '';
return text?.replaceAll('\\n', '\n')
}
<Highlight
language="sql"
copyable={true}
lineNumber={true}
>
{sqlFormat(sqlValue)}
</Highlight> https://i-blog.csdnimg.cn/blog_migrate/d8967eebf87675b1b972b3953393819b.png
第二种 :后端未未处置惩罚的数据 (借助sql-formatter插件处置惩罚)
pnpm install sql-formatter@12.2.0
import { format } from 'sql-formatter';
import { Highlight } from '@alipay/tech-ui';
const sqlValue = " SELECT split_part( split_part( aliyun_network.top100_channel_pid_fy_cash_ex_fy.pid, 'd',4, 1),'end', 1 , 1 ) as 222 ,split_part( split_part( aliyun_network.top100_channel_pid_fy_cash_ex_fy.pid, 's',2, 1),'d', 1 , 1 ) as 333 ,split_part( split_part( aliyun_network.top100_channel_pid_fy_cash_ex_fy.pid, '1',4, 1),'1', 1 , 1 ) as 111 ,split_part( split_part( intern_study_dev.a.a1, 'D',2, 1),'v', 1 , 1 ) as test1 ,split_part( split_part( intern_study_dev.a.a1, 'start',1, 1),'D', 1 , 1 ) as test2 ,split_part( split_part( intern_study_dev.a.a1, '拭',2, 1),'end', 1 , 1 ) as test3 , null.a.a1, null.a.item_id, null.a.key, null.a.a2, null.a.a_id, null.top100_channel_pid_fy_cash_ex_fy.ds, null.aaa.dds FROM intern_study_dev.a JOIN intern_study_dev.a ON intern_study_dev.a.a_id = intern_study_dev.a.intern_study_dev.a JOIN aliyun_network.top100_channel_pid_fy_cash_ex_fy ON crm_data.aaa.dds = aliyun_network.top100_channel_pid_fy_cash_ex_fy.aliyun_network.top100_channel_pid_fy_cash_ex_fy JOIN aliyun_network.top100_channel_pid_fy_cash_ex_fy ON intern_study_dev.a.a2 = aliyun_network.top100_channel_pid_fy_cash_ex_fy.aliyun_network.top100_channel_pid_fy_cash_ex_fy JOIN crm_data.aaa ON intern_study_dev.a.key = crm_data.aaa.crm_data.aaa "
const sqlFormat = (text : string) => {
if (!text) return '';
try {
return format(text, {
expressionWidth: 500,
paramTypes: {
custom: [{ regex: String.raw`#\{.+?\}` }],
},
});
} catch (error) {
return text
}
}
<Highlight
language="sql"
copyable={true}
lineNumber={true}
>
{sqlFormat(sqlValue)}
</Highlight> https://i-blog.csdnimg.cn/blog_migrate/c8438768a4d67ec96cba40e2f9a446a2.png
暂时就接触这两种语言,其他语言后续会更新~~~
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页:
[1]