flask server返回json数据对象中有空格的数据提取方法，正常前端是无法用.的形式调用，原因是变量中不能由空格

问题描述

提示：这里描述具体问题：在quasar框架开发中，前端界面在提取后台返回数据时，发现后台返回的数据中有空格，导致前端无法用正常的.的形式调用。
server 返回数据：

cat_class: {,…}
	cat one: {catnum: 23,…}
		one: [{cat_name: "lihua", cat_size: "4cm", cat_age: "one",…},…]
	catnum: 23

在vscode中代码提示如下：

dataList.value.push(res.data.cat_class.cat one)

eslint提示如下：

any
Parsing error: Unexpected token, expected "," (116:58)eslint
',' expected.ts(1005)
No quick fixes available

---

原因分析：

提示：这里填写问题的分析：由于javascript中的变量定义是不允许有空格的，所以不能正确调用。

---

解决方案：

提示：这里填写该问题的具体解决方案：利用json的特性来解决。

有两种方式可以解决：
1.用数组形式调用。

      const Json = res.data.cat_class /* your JsON object */
      console.log(Json['cat one'].one)

结果如下：

(23) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}] // 23个数组
0: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
1: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
2: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
3: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
4: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
5: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
6: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
7: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
8: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
9: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
10: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
11: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
12: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
13: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
14: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
15: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
16: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
17: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
18: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
19: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
20: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
21: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
22: {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
length: 23
[[Prototype]]: Array(0)

2.用for循环打印

      const obj = Json['cat one']
      // console.log(obj.one)
      for (let i = 0; i < obj.one.length; i++) {
        console.log(obj.one[i])
      }

打印结果：

 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}
 {cat_name: "lihua", cat_size: "4cm", cat_age: "one"}

到此完美解决。

---

欢迎评论：

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