Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfront

最新推荐文章于 2024-02-23 10:42:00 发布
最新推荐文章于 2024-02-23 10:42:00 发布
阅读量7.7k 收藏 1
点赞数 1
文章标签： 前端 javascript uni-app 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40860800/article/details/123066525
版权

小程序中 [Vue warn]: Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfront in the data option.
在这里插入图片描述
上面报错的意思是没有在data中预先声明某一变量；

昨天不是说了在uni-app项目中重写了setData方法嘛，我记得微信小程序中使用this.setData({})时不提前声明变量是可以的，所以就习惯性的使用了，结果就一直报这个错，经过盘查之后发现是因为没有在data中预先声明。

把setData的变量都在data中声明一遍之后就没有这个报错信息了，虽然办法很笨，但是结果还是好的！！！

如何在uni-app中重写setData方法

IT的开端
关注
报错：Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfr
HELLO WORLD
04-01 3万+
报错内容： Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfront in the data option. 报错代码 为啥会报错？ 知识点 受 ES5 的限制，Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转...
Avoid adding reactive properties to a Vue instance or its root $data at runtime
Misnice的博客
11-17 1万+
[Vue warn]: Avoid adding reactive properties to a Vue instance or its root dataatruntime−declareitupfrontinthedataoption.![在这里插入图片描述](https://img−blog.csdnimg.cn/0657961c352a4a77b5cf032ad72f4f3e.png)报错原因：this.data at runtime - declare it upfront in the dat
Avoid adding reactive properties to a Vue instance or its root $da
2201_75783276的博客
06-20 484
避免在运行时向Vue实例或其根$data添加反应性属性-在数据选项中预先声明它。在页面中声明对象，直接修改即可。
[Vue warn]: Avoid adding reactive properties to a Vue instance or its root $data at runtime - declar
romantic6666的博客
01-06 1万+
大概意思就是说 避免在运行时向Vue实例或其根$data添加反应性属性-在数据选项中预先声明它。他让我们在$data添加属性，我们就进行添加。可以先在按钮里面定义一个属性，名字随意，如图。然后在data里面将他return回去就行。
Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfront in the data option
12-02
在Vue中，如果你想要在实例中添加响应式属性，最好的方式是在data选项中预先声明它们。如果你在运行时添加响应式属性，Vue会发出警告，因为这样做可能会导致一些问题。因此，最好的做法是在data选项中声明所有的响应...
Avoid adding reactive properties to a Vue instance or its root $data at runtime - declar
weixin_42091569的博客
06-20 3120
大家好我是王超朋: 想更快更有效率的结局bug,那就必须迅速的定位问题,找出和原因,但是我们在使用第三方框架时,有是有的bug让人找不到眉目.最简单的办法,就是吧他们的源码阅读一遍. 咋们看一下抛出该异常的代码块: /** vue.$set 函数 */ function set (target , key, val) { // 在生产模式下,isPrimitive是不是基本类型, if (process.env.NODE_ENV !== 'production' &&.
Vue2.7 setup v-model报错Avoid adding reactive properties to a Vue instance or its root $data
最新发布
weixin_43187898的博客
02-23 490
会报错vue.runtime.esm.js:4625 [Vue warn]: Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfront in the data option.是因为ref 也是numberValidateForm，所以只要把ref=“numberValidateForm” 换个名字就可以了。拷贝了一个elment form demo。
vue2.7[Vue warn]: Avoid adding reactive properties to a Vue instance or its root $data at runtime -
qq_42372534的博客
09-19 470
经过排查,报错原因是因为setup语法糖中返回了。使用vue2.7的setup语法糖中,绑定了。的变量同名了,改一下使其不同名字即可。
十三.vue源码学习之响应式数据
TyrionJ的博客
04-17 572
date: 2020-04-15 tag: sourcecode vue author: TyrionJYQ title: 十三. 响应式数据 响应式数据 Object.defineProperty 代理 代理props vue将配置项中的props属性代理到vm上 const vm = new Vue({ props: ['msg'] }) 通过this.msg能够访问到props...
解析vue响应式原理1
weixin_45032957的博客
01-21 228
import Dep from ‘./dep’ import VNode from ‘…/vdom/vnode’ import { arrayMethods } from ‘./array’ import { def, warn, hasOwn, hasProto, isObject, isPlainObject, isPrimitive, isUndef, isValidArrayIndex, isServerRendering } from ‘…/util/index’ const arrayKeys
Vue官方文档梳理-全局API
大灰狼的小绵羊哥哥的博客
07-24 6150
Vue.extend 配置项data必须为function，否则配置无效。data的合并规则（可以看《Vue官方文档梳理-全局配置》）源码如下： 传入非function类型的data（上图中data配置为{a:1}），在合并options时，如果data不是function类型，开发版会发出警告，然后直接返回了parentVal，这意味着extend传入的data选项被无视了。 我们知道
vue采坑一：全局API
weixin_30588907的博客
06-30 82
Vue.set Vue.set( target, key, value )，target不能是 Vue 实例，或者 Vue 实例的根数据对象，因为源码中做了如下判断： var ob = (target).__ob__; if (target._isVue || (ob && ob.vmCount)) { "development" !== 'production' &a...
【vue warning】avoid mutating a prop directly
热门推荐
u010671652的专栏
10-28 1万+
[vue warning] avoid mutating a prop directly 一、问题描述 使用props，通过父组件给子组件传值，子组件在使用props中的属性时，直接对props中的属性进行了修改。修改方式为直接对props中的属性赋值，或者使用双向绑定。 父组件代码： <categroy :course="item" /> 子组件代码： <template&...
Vue学习：监测数据改变原理--Vue.set
weixin_47295886的博客
02-13 159
所以Vue.set只可以给data里面的某一个对象添加属性，而不能给data追加属性 vm不允许是Vue.se的目标，并且vm.data也不允许 必须在外面包含一个属性或者直接使用
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值