我不明白为什么axios会返回一个字符串而不是json。有人能告诉我为什么吗?
<template>
<div class="app">
<Header/>
<h1>{{services}}</h1>
<Services v-bind:services="services"></Services>
</div>
</template>
<script>
import Header from "./components/Header.vue";
import Services from "@/components/Service";
import axios from 'axios';
export default {
name: 'App',
components: {
Services,
Header,
},
data() {
return {
services: [],
}
},
created() {
const instance = axios.create({
baseURL: 'http://localhost:3000/api',
timeout: 1000,
headers: {'Authorization': 'Bearer ' + 'mysecretcode'}
});
instance.get('/service')
.then(response => {
this.services = response.data;
console.log(response.data);
})
.catch(e => {
this.errors.push(e)
})
},
}
</script>
<style>
</style>
我在网上看到response.data应该只发送解析后的json数据,但在我的{{services}}上我得到了这个:
{“status”:1,“message”:“操作成功”、“数据”:[ {“_id”:“5edfdaf5586d4c75036bc853”,“title”:“Logo rapide”,“description”:“testing service desc”,“createdAt”:“2020-06-09T18:54:45.904Z”},{“_id”:“5edfdafd586d4c75036bc854”,“title”:“Logo rapide”,“description”:“testing service desc”,“createdAt”:“2020-06-09T18:54:53.054Z”},{“_id”:“5edfdc8bc07c7677915275c1”,“title”:“Logo rapide”,“description”:“testing service desc”,“createdAt”:“2020-06-09T19:01:31.945Z”},{“_id”:“5edfdc8cc07c7677915275c2”,“title”:“Logo rapide”,“description”:“testing service desc”,“createdAt”:“2020-06-09T19:01:32.621Z”} ] }
而不是解析的数据。感谢您的评分
4条答案
按热度按时间yuvru6vn1#
如果响应是
string
,则可以使用用途:this.services = JSON.parse(response.data).data
否则,如果它已经是一个
JSON
对象(我认为它可能是-但从response.data
获取实际数据object
):this.services = response.data.data
然后您可以使用
v-for
并使用{{service.title}}
获取标题希望有帮助。
nue99wik2#
JSON中可能有错误。Axios在无法将数据解析为JSON时返回字符串。JSON中的常见错误是参数名中缺少引号。比较:JS:{x:“y”} JSON:{“x”:“y”}
k2arahey3#
这与服务器端的无效JSON有关。您可以使用https://jsonlint.com/等在线JSON验证器来验证JSON响应。
bq8i3lrv4#
你可以使用interceptior来修复这个bug