quasar框架中使用vue3保存后端json数据，带缩进格式

问题描述

提示：这里描述具体问题：quasar框架中使用vue3保存后端发来的数据，总是一行。
没有缩进格式非常难看。
代码：

	const blob = new Blob([JSON.stringify(shuiguo.value)], { type: 'application/json;charset=utf-8' })
    saveAs(blob, 'test.json')

格式如下：

{"users": [{"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"}        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"}]}

---

原因分析：

提示：这里填写问题的分析：在进行json数据对象转换成字符串的函数中没有使用最后一个参数。

JSON.stringify(value[, replacer[, space]])

函数如下：
例如：在一些项目中在页面更新时会发送GET请求到后端获取数据。之前已经获取过了，在获取就会出现没有数据。

1. value：第一个参数，将要序列后成 JSON 字符串的值。
2. replacer：【可选】第二个参数
   （1）如果该参数是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；
   （2）如果参数是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。
   （3）如果该参数为未提供或者null ，则对象所有的属性都会被序列化。
3. space：【可选】第三个参数，美化文本格式，文本添加缩进、空格和换行符。
   （1）如果 该参数是一个数字，则返回值文本在每个级别缩进指定数目的空格。
   （2）该参数最大值为10，如果 该参数大于 10，则文本缩进 10 个空格。
   （3）该参数也可以使用非数字，如：\t。最大值为10

---

解决方案：

提示：这里填写该问题的具体解决方案：使用第三个参数JSON.stringify(value[, replacer[, space]])，缩进字符数。

代码：

	const blob = new Blob([JSON.stringify(shuiguo.value, undefined, 2)], { type: 'application/json;charset=utf-8' })
    saveAs(blob, 'test.json')

效果：

{
    "users": [
        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"}
        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"}
        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"}
        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy",age:30, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy1",age:23, test:"sadasdasdasdasdasdasdsads"},
        {"username":"yzy2",age:42, test:"sadasdasdasdasdasdasdsads"}
    ]
}

欢迎评论：

提示：欢迎大家在评论区讨论相关问题。
可以关注博主，我会持续更新工作中遇到的技术小砖头，供大家使用。
也可以在评论区告知好的小砖头或技术，我会收录。
还可以指出本博文错误，希望大家不吝赐教。