接口返回这样的数据，vue如何获取data中的数据

你是拿哪个变量接收的返回数据

比如如果你使用变量叫res接收的的话，如果向获取里面的pid的话，针对这条数据，就是

resdata[0]pid

因为data是个数组，虽然这里面只有一个元素

JSON。parse()作用是将字符串转化成json数组，JSONstringify()作用是将json数组转换成字符串

对浏览器来说，使用Web Storage存储键值对比存储Cookie方式更直观，而且容量更大，它包含两种：localStorage和sessionStorage

所以上次使用cookie的时候就遇到了一个坑，设置后马上访问session会获取不到，蛋痛，还需要刷新一下，原因是：

当我们首次访问设置Cookie的页面是，服务器会把设置的Cookie值通过响应头送过来，告诉浏览器将cookie存储的本地相应文件夹中(注意：第一次访问时本地还没有存储Cookie，所以此时获取不到值)；

当第二次访问时（或是进行cookie设置后，过期前所有的访问）时，请求头信息中你都会把Cookie值携带。

localStorage有效期是永久的。一般的浏览器能存储的是5MB左右。sessionStorage api与localStorage相同。

sessionStorage默认的有效期是浏览器的会话时间（也就是说标签页关闭后就消失了）。

localStorage作用域是协议、主机名、端口。（理论上，不人为的删除，一直存在设备中）

sessionStorage作用域是窗口、协议、主机名、端口。

知道了这些知识点后，你的问题就很好解决了。

localStorage是window上的。所以不需要写thislocalStorage，vue中如果写this，是指vue实例。会报错

当你使用这种方式时，我们会马上导航和渲染组件，然后在组件的 created 钩子中获取数据。这让我们有机会在数据获取期间展示一个 loading 状态，还可以在不同视图间展示不同的 loading 状态。

假设我们有一个 Post 组件，需要基于 $routeparamsid 获取文章数据

在导航完成前获取数据

通过这种方式，我们在导航转入新的路由前获取数据。我们可以在接下来的组件的 beforeRouteEnter守卫中获取数据，当数据获取成功后只调用 next 方法。

以上就是关于接口返回这样的数据，vue如何获取data中的数据全部的内容，包括:接口返回这样的数据，vue如何获取data中的数据、vue中使用localStorage存储信息、vue导航完成前后获取数据等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！