项目中有个功能是实现编辑json数据,我使用了vue-codemirror框架,但是传入json后都变成了一行,于是从框架本身入手,但是未能如愿,后面从源头入手解决了这个问题。
这里是展示代码的子组件,jsonDetail就是要传入的数据,它本身是一个vue中props里的一个对象
mounted() {
try {
this.editData = JSON.stringify(this.jsonDetail, null, "\t");
} catch (error) {
console.log(error);
}
},
JSON.stringify(this.jsonDetail, null, "\t");
这个最重要,JSON.stringify的第三个属性就是让我们格式化代码用的,你也可以直接传入数字x(10以内),就表示前面是x个空格的距离,我是用'\t'
,这样就是一个tab的距离了。