先上效果图
最近有个小demo,做一个规则生产的项目,需求方希望返回的jscon数据可以这么展示,于是使用了这这个插件
首先安装
npm
下载
$ npm install vue-json-pretty --save
yarn
下载
$ yarn add vue-json-pretty
引入
(在需要使用这个插件的文件里面引入就可以了)
import VueJsonPretty from "vue-json-pretty";
import "vue-json-pretty/lib/styles.css";
注册
components: {
VueJsonPretty,
},
使用
我这里因为是一个json数组,所以循环遍历了一下然后展示的,效果就是文章开头的效果
参数
附上地址:https://www.npmjs.com/package/vue-json-pretty
注意
需要注意的是,如果是
vue2
使用的话,版本选择
1.7.x
如果出现安装好了,引入成功了,组件注册也没问题,但是一直报错,大概率是版本不对,使用
vue3
的话,记得把版本更新到最新的。