axios给了我JSON对象，但可以'；t解析到Javascript对象

我一直想弄明白这一点，但不知道我做错了什么。我还不熟悉Aurelia、Typescript和Axios

后端为我提供了一个JSON对象数组，我希望将其解析为Javascript对象。酷。对于我的假数据，我使用了JSONplaceholder。当我解析时，返回的是[object object]（请参阅底部图像链接）。我做错了什么？最后，我想提取特定的数据，比如info.name，并显示名称

test.ts

import axios from 'axios';
const apiURL = 'https://jsonplaceholder.typicode.com/users';

declare var $: any;


export class Test {
    info: string;
    infoX: string;
    public constructor () {
      axios.get(apiURL)
        .then(response => {
          this.info = JSON.stringify(response.data)
          this.infoX = JSON.parse(this.info);
          console.log(this.info);
          console.log(this.infoX);
        })
        .catch(error => console.log(error));
    }
}

import axios from 'axios';
const apiURL = 'https://jsonplaceholder.typicode.com/users';

export class Data {
    infos: string;
    public constructor () {
      axios.get(apiURL)
        .then(response => {
          this.infos = response.data;
          console.log(this.infos);
        })
        .catch(error => console.log(error));
    }
}

test.html

<template>
  <pre style="margin-top: 200px">${info}</pre>
  <pre style="margin-top: 200px">${infoX}</pre>
</template>

<template>
    <ul>
        <li repeat.for="info of infos">
          Name: ${info.name}
        </li>
    </ul>
</template>

${info}
${infoX}

---

以下链接帮助我澄清了一些困惑：

然后在注释中听取Jame的建议，我在数组中迭代，并从服务器返回数据

test.ts

import axios from 'axios';
const apiURL = 'https://jsonplaceholder.typicode.com/users';

declare var $: any;


export class Test {
    info: string;
    infoX: string;
    public constructor () {
      axios.get(apiURL)
        .then(response => {
          this.info = JSON.stringify(response.data)
          this.infoX = JSON.parse(this.info);
          console.log(this.info);
          console.log(this.infoX);
        })
        .catch(error => console.log(error));
    }
}

import axios from 'axios';
const apiURL = 'https://jsonplaceholder.typicode.com/users';

export class Data {
    infos: string;
    public constructor () {
      axios.get(apiURL)
        .then(response => {
          this.infos = response.data;
          console.log(this.infos);
        })
        .catch(error => console.log(error));
    }
}

test.html

<template>
  <pre style="margin-top: 200px">${info}</pre>
  <pre style="margin-top: 200px">${infoX}</pre>
</template>

<template>
    <ul>
        <li repeat.for="info of infos">
          Name: ${info.name}
        </li>
    </ul>
</template>

名称：${info.Name}

No，后端会给您一个JSON字符串——因此请在响应处理程序中去掉JSON.stringify。现在，假设您在javascript中有一个对象数组，并尝试将其设置为某个div的html-您将得到

[[Object Object]，[Object Object]…]

。您需要迭代数组，从对象中提取各种属性并显示它们。您的问题不在于解析，而在于打印

${infoX}

将数组转换为与

JSON不同的字符串。stringify

@James感谢您的回复。你能为我澄清一下吗？如果后端给了我一个字符串，那么对象数组是否必须用引号括起来？通常，您用来将本机对象或数组转换为JSON的后端函数会处理所有引号，但看起来您发送/接收JSON的方式很好。@James，感谢您的帮助和澄清。给我指出了正确的方向。键是迭代的，就像你提到的。更好地理解JSON.parse和JSON.stringify。