uni-app通过vite编译vue3项目 运行到支付宝开发者工具 控制台data栏内数据显示异常

uni-app通过vite编译vue3项目 运行到支付宝开发者工具 控制台data栏内数据显示异常

7 回复

吧出问题的demo给一下

更多关于uni-app通过vite编译vue3项目 运行到支付宝开发者工具 控制台data栏内数据显示异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html


不需要demo, 直接用hbuilder的第二套模板’hello uni-app’编译出来也是一样的问题，我认为应该是官方的Bug

微信开发者里面也是一样的，搞的都没法调试

非bug，为了支持更多语法，减少数据量，所有数据会被格式化

额，有配置可以还原么，因为调试实在不方便，只能手动打印看数据

回复 p***@163.com: 不能还原，后续可以考虑提供类似浏览器上的 vue devtools 功能

在 uni-app 通过 Vite 编译 Vue3 项目运行到支付宝开发者工具时，控制台 data 栏数据显示异常，常见原因是 Vue3 的响应式数据（Proxy 对象）在小程序环境下的调试工具中无法正确解析。支付宝开发者工具的 data 栏只支持显示普通 JSON 对象，而 Vue3 的 ref、reactive 返回的是 Proxy 或被 __v_skip 标记的对象，导致显示为空白、只读、[object Object] 或 Proxy 字样。

核心原因：

  • 使用 console.log(data) 直接打印响应式数据，开发者工具无法展开 Proxy 的深层属性。
  • 部分情况下，data 字段在开发工具的 AppData 或 PageData 面板中未正确序列化（与 Vue Devtools 兼容性有关）。

解决方向：

  1. 打印时先转为普通对象：
    console.log(JSON.parse(JSON.stringify(data))) // 注意：会丢失函数、Symbol、循环引用
// 或
console.log(toRaw(data)) // 需要 import { toRaw } from 'vue'
回到顶部