问题

在项目中控制台报下图错误：

Property or method “toJSON” is not defined on the instance but
referenced during render. Make sure that this property is reactive,
either in the data option, or for class-based components, by
initializing the property.
在这里插入图片描述

解决

  1. 查看报错详情，在全局文件查找 toJSON 字段，并没有找到项目中有该字段，于是怀疑是vue实例内部问题。
  2. 发现每个报错中都是在single组件中报错的，定位到single组件。
  3. 发现组件内向子组件传入了single整个vue实例，如下图所示：
    在这里插入图片描述
  4. 为了实现相同的功能，便在data重新声明一个属性，并且将实例赋值进去。
    在这里插入图片描述
  5. 修改后代码：
    在这里插入图片描述
  6. 测试后，控制台无报错。

(具体原因有待研究)

参考

Vue错误——Property or method “toJSON” is not defined on the instance but referenced during render.

Logo
Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^

avatar Vue
cover

echarts堆叠柱状图

avatar Vue

Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'current')"

这是一个 Vue.js 错误，报错信息提示在 v-on 处理程序中出现了错误：“TypeError: Cannot read properties of undefined(读取 'current')”。这意味示在您的代码中，试图读取一个未定义的变量 'current'。您需要检查您的代码，确保 'current' 已正确定义并初始化。...

avatar Vue