欢迎来到代码驿站!

vue

当前位置:首页 > 网页前端 > vue

vue实现codemirror代码编辑器中的SQL代码格式化功能

时间:2021-08-06 09:07:22|栏目:vue|点击:

vue实现codemirror代码编辑器中的SQL代码格式化功能

1、首先使用npm安装sql-formatter插件

npm install --save sql-formatter

2、然后引入该sql-formatter.js文件

import sqlFormatter from "sql-formatter";

3、接下来就是针对需要格式化的代码调用该方法就OK啦

 /*代码格式化*/
   format(){
    /*获取文本编辑器内容*/
    let sqlContent="";
    sqlContent=this.editor.getValue();
    /*将sql内容进行格式后放入编辑器中*/
    this.editor.setValue(sqlFormatter.format(sqlContent));
   }

4、下面截图就是格式化前与格式化后的区别

格式化代码前

格式化代码后

总结

上一篇:前端vue-cli项目中使用img图片和background背景图的几种方法

栏    目:vue

下一篇:vue.js简单配置axios的方法详解

本文标题:vue实现codemirror代码编辑器中的SQL代码格式化功能

本文地址:http://www.codeinn.net/misctech/164712.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有