bootstrap-table表格中格式化输出后端返回的json数据

  1. 默认情况只把JSON对象转换为json字符串的代码和效果图如下:
JSON.stringify(value, null, 2)//缩进2个空格

我们可以看到显示的json数据是格式很乱的。
bootstrap-table表格中格式化输出后端返回的json数据_第1张图片
2. 如何将json格式的数据格式化输出呢?我们可以使用

标签,具体的使用方法可以参考:http://www.techug.com/post/styling-pre-tag.html 
加上pre标签后的js代码和效果图如下:

"
"+JSON.stringify(value, null, 2)+"
"

我们看到图中的json数据已经按照json格式输出来了,但是它横向占了很长的位置,要如何解决呢?看下一步。
bootstrap-table表格中格式化输出后端返回的json数据_第2张图片

  1. 在展示代码的时候,你需要选择究竟是否折行。如果你选择折行,幸运地,你可以使用为
    标签提供的独一无二的样式来保留空白同时折行,如同下面这样:
pre {
  white-space: pre-wrap;
}
"
"+JSON.stringify(value, null, 2)+"
"

效果图如下:
bootstrap-table表格中格式化输出后端返回的json数据_第3张图片

你可能感兴趣的:(【前端】)