vue前端收到的数据与后台发送的数据不一致是什么原因

打印出后台从数据库中查询出的数据，发现字段是完整的，并无缺失；打印JSON字符串，发现缺少字段，定位到问题入口；查看JSONtoJSONString()方法后，并未发现异常；将该模块的所有文件重新审阅一遍后发现，实体类Userjava中有个布尔类型的成员变量的get方法不对头；这就导致JSON将User对象转换成json字符串时，无法通过反射获取到其state字段，最终给前端的json数据也就没有该字段。

处理方法，重写实体类User的get、set方法并检验，确保不再出错。重启后，测试显示正常。查看后台支持的编码格式和前端axios发送过去的的编码格式是否一致。不一致就会出现跨域问题。至于为什么也不明白，可能是浏览器认为不一致的编码就是跨域也可能就是浏览器的bug。Vue请求后端数据的方法，首先在api文件夹下，建立接口js文件；然后确定baseURL和url后缀；最后输入需要获取数据的代码即可。千锋教育截止目前已在北京、深圳、上海、广州、郑州、成都、大连等20余个核心城市建立直营校区，服务近20万学员、近千所高校和数万家企业。

使用vuejs与后台实现数据交互的方法是利用vue-resource组件提供的一系列api：

get(url, [data], [success], [options])

post(url, [data], [success], [options])

put(url, [data], [success], [options])

patch(url, [data], [success], [options])

delete(url, [data], [success], [options])

jsonp(url, [data], [success], [options])

具体举例如下：

1、导入vue-resource

2、基于全局Vue对象使用>

在讲这个之前，首先要明白一点，这个所谓的响应式，其实本身就是对 MVVM 的理解。

MVVM 其实就是所谓的 Modal View ViewModal 。

简单理解，就是你的 data 中的数据，和 template 模板中的界面，本身就是两个东西。

但是， Vue 给你做了一层中间的 ViewModal ,让视图上的改变能反映到 data 中， data 中的改变能反映到视图上。

在这个反映过程中，ViewModal就是视图和数据的一个桥梁。

同样是让 a + 1 。

在 Vue 中，这个桥梁是你看不见的，因为 Vue 都帮你完成了视图和数据的变化传递。

而 React 就是侵入式的，因为要显式地声明 setState ，通过它，来设置变量的同时，设置视图的改变。

所以，所谓的侵入式，其实就是对于桥梁的侵入。

所以， Vue 的神奇之处就在于，不需要我们手动地显示调用 setState ，也就是这个桥梁， Vue 已经帮我们桥接上了。

要让 data 改变的同时，视图也发生改变，所以，问题的所在，就是我们需要监听，什么时候，这个变量发生了变量。

然而， ES5 中，就有那么一个特性，可以做到对于数据的劫持（监听）。

它就是 ObjectdefineProperty 。

ObjectdefineProperty( obj, prop, descriptor ) 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象，与此同时，它可以对 对象的一些额外底层的属性进行设置 。例如可以设置 writable ， enumerable , configurable 等属性。

后面的额外属性设置，才是我们使用它的重点。

但是，我们使用的不是上面的几个属性，最主要的还是它的 get set ，可以对属性值的获取和设置 *** 作进行拦截。

get主要是可以对值的获取进行拦截，，它必须要传入一个 return ，并且， 该函数的返回值会被用作属性的值 。我们可以来看一个例子:

由于设置了 get ，所以，输出 aname 的时候直接会被拦截，走 get() 中的 return 所以，此时， aname 的值应该是 你已经被拦截了!。

set主要是可以对值的设置进行拦截，该方法会接受一个参数，那就是 被赋予的新值 。我们可以来看一个例子:

由于设置了 set ，所以，设置值的时候会被拦截，走 set() 中的方法。

所以， Vue 能自动获取data中的改变，反映到视图的原因，就是有对于变量的获取和设置的劫持，当变量发生改变的同时， Vue 能在第一时间知道，并且对视图做出相应的改变 *** 作。

而这把钥匙就是 ObjectdefineProperty 。

尚硅谷Vue源码解析之数据响应式原理

ObjectdefineProperty() - MDN

以上就是关于vue前端收到的数据与后台发送的数据不一致是什么原因全部的内容，包括:vue前端收到的数据与后台发送的数据不一致是什么原因、vue为啥会访问两次后端接口呢、【手把手教你搓Vue响应式原理】（一）初识Vue响应式等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！