页面中快速使用JSON数据格式化模块插件
JSON数据格式化模块插件,可以用来展示JSON数据,也可以验证某数据是否为JSON格式
1、可以使用 b-code-editor插件 来实现效果,方便快捷,
安装命令:npm install bin-code-editor -d
2、在项目的main.js文件中导入并全局安装
import CodeEditor from 'bin-code-editor';
Vue.use(CodeEditor);
3、具体页面中使用即可
<b-code-editor
v-model="jsonStr"
:auto-format="true"
:smart-indent="true"
theme="dracula"
:indent-unit="4"
:line-wrap="false"
ref="editor">
</b-code-editor>
4、设置测试数据
jsonData:`{
"employees": [
{
"firstName": "Bill",
"lastName": "Gates"
},
{
"firstName": "George",
"lastName": "Bush"
},
{
"firstName": "Thomas",
"lastName": "Carter"
}]
}`
5、最终实现效果如下