做项目时候，后端返回json数据要求前端在页面上展示格式化的数据，查了半天的资料，学到了
方法：
JSON.stringify(value, replacer, space)
- value：js对象
- replacer：替换对象，可以是一个方法、对象或数组，将value按照替换规则展示。
- space：填充参数，可以是数字或字符串，将value按照参数进行格式化展示。
this.showBizContent = JSON.stringify(content.context.bizContent, null, ' ')
我们在控制台中打印出来是这样的
image.png
但是我们在页面中直接展示的话
<div>{{ showBizContent }}</div>
但是在页面中展示，他还是一坨，根本不是json格式化后的数据
我们直接在里面添加'<pre>'就可以了
pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。
<div v-html="'<pre>'+showBizContent+'</pre>'"></div>
image.png
你看，页面中，数据展示出来的就是 json格式化的数据
网友评论