浏览器控制台console打印结果与接口返回结果不一致的原因
在进行前端vue/cli搭建的管理系统开发时 遇到浏览器控制台console打印结果与接口返回结果不一致的问题下面具体说下 首先控制台console打印结果图然后是直接在浏览器地址栏访问的结果图区别在于有两个字段的值不一样 于是本人灵机一动试试久违的jQuery的ajax请求吧,下面是ajax请求的控制台打印结果事实是ajax没有问题 与浏览器地址栏请求的结果相同 暂时只能认为axios对数据的解
·
在进行vue-cli框架搭建的管理系统开发时.遇到浏览器控制台console打印结果与后台接口返回结果不一致的问题.
经过本人多方测试.发现问题.现在分享出来.希望对各位小伙伴们有帮助.
首先.直接在浏览器地址栏访问接口的结果
其次.控制台打印的结果
此时的js代码
$.ajax({
'url':'http://127.0.0.1:8081/bus/selectBYID',
'type':'get',
'dataType':'json',
'data':{
'id':id
},
success:result => {
let {data,list} = result;
this.bus = data;
this.items = list;
console.log(result);
}
});
可以发现start和night这两个字段的值发生了变化.后来发现删除
this.bus = data;
这行代码之后.控制台console打印的结果与浏览器地址栏的结果相同.最终发现原因在于使用view-design这个ui框架造成的原因.
start和night这两个字段是用来显示时间.由于框架需求的格式为
'HH:mm:ss'
而接口返回的数据格式为
'yyyy-MM-dd HH:mm:ss'
导致框架对这两个字段进行了内部的格式化.导致数据发生了变化.最终问题解决之后的代码
$.ajax({
'url':'http://127.0.0.1:8081/bus/selectBYID',
'type':'get',
'dataType':'json',
'data':{
'id':id
},
success:result => {
let {data,list} = result;
/**
* 手动将数据的格式调整为ui框架需求的格式
* 即06:00:00这种格式
*/
data.start = data.start.substring(11,19);
data.night = data.night.substring(11,19);
this.bus = data;
this.items = list;
console.log(result);
}
});
最后,如果各位小伙伴在使用ui框架的时候一定要小心 view-ui element-ui等等
吐槽
都是ui框架不好.数据格式不正确.你TMD报错就好了.把我的数据转换的乱七八糟是要干什么啊
如果有其他类似的问题.欢迎私信
更多推荐
已为社区贡献1条内容
所有评论(0)