axios给了我JSON对象,但不能解析为Javascript对象

时间:2018-01-05 18:29:10

标签: javascript json typescript aurelia axios

我一直试图解决这个问题,并且不知道我做错了什么。我也是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));
    }
}

的test.html

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

screenshot of what the console log and view displays

1 个答案:

答案 0 :(得分:0)

以下链接有助于消除我遇到的一些困惑:simple explanation of JSON.parse and JSON.stringify

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

test.ts

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>
    <ul>
        <li repeat.for="info of infos">
          Name: ${info.name}
        </li>
    </ul>
</template>