vue整合codemirror组件,实现前端页面代码的编辑及显示(sql,java,python等)

1.用途

用于前端页面编辑,展示代码,可以灵活选择语言,比如shell,sql,python,js等,可自定义主题及代码提示等,功能非常强大

2.效果图

我这边是用来展示sql脚本的,结合了element-ui弹出层来实现的

3.插件安装

npm install vue-codemirror --save

4.代码

html

<codemirror v-model="content" :options="options"