vue elementUI出现值绑定问题:Cannot set reactive property on undefined, null, or primitive value: null

最新推荐文章于 2024-02-01 15:01:28 发布

scp_245

最新推荐文章于 2024-02-01 15:01:28 发布

阅读量383

点赞数 1

文章标签： vue.js elementui 前端

本文链接：https://blog.csdn.net/scp_245/article/details/132335205

版权

文章讲述了作者在使用Vue.js时遇到的问题，即如何将输入框的值绑定到data中的number属性上。起初尝试使用`v-model=this.number`报错，后来发现去掉`this`直接使用`v-model=number`即可解决问题。

摘要由CSDN通过智能技术生成

今天在写前端页面时

想把一个输入框的值通过v-model绑定到data中的一个属性上

<el-input v-model="this.number"></el-input>

data(){

return{

number:''

}

结果在页面输入时报错
Cannot set reactive property on undefined, null, or primitive value: null

很奇怪啊检查半天也没发现什么问题

试过把number:0 number:undifined number:""

都没用

结果发现这个绑定不需要加this

直接

<el-input v-model="number"></el-input>

问题解决

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

scp_245

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

多种方法解决[Vue warn]: Cannot set reactive property on undefined, null, or primitive value: xxx 的警告

念兮为美

10-31

1353

多种方法解决[Vue warn]: Cannot set reactive property on undefined, null, or primitive value: xxx 的警告

Cannot set reactive property on undefined, null, or primitive value:null解决

我爱美女S的博客

03-08

1万+

用了el-switch，在v-model那里我先写了v-model=“switch”，结果有红色下划线。我就神经短路改成了this.switch。然后在新网页打开那个switch,点击就会报如上错。不能用this.value的形式！有下划线是因为官方不允许用JS关键字switch做value的名字，改下value的名字就好了。 ...

1 条评论您还未登录，请先登录后发表或查看评论

【Vue】Cannot set reactive property on undefined,null,or primitive value:undefined

No8g攻城狮的博客

03-15

1万+

在我的代码中主要是点击某一个按钮后弹窗显示出来的页面在渲染之前会先调用API进行数据查询，根据查询到的内容渲染到页面，但是API接口返回的数据为空，然后把这个空对象赋值给了已经有初始化值的form 了，在form进行渲染的时候就会出现这个错误。根据报错内容翻译一下，就是不能对 undefined,null 或者原始值为 undefined 的属性设置值。而本来的form在data中定义的应该是一个对象或默认值。对API返回的数据进行非空判断即可。总的来说，我们就是不能对未知的对象进行渲染。

不能对未知的对象进行渲染v-model Cannot set reactive property on undefined, null, or primitive value: undefined

qq_51389137的博客

04-26

4000

不能对未知的对象进行渲染还有的报错直接的原因就是 v-model绑定的数据 <el-form-item label="公司名称"> <el-input v-model="tableData['名称']"></el-input> </el-form-item> 或者一整个表单:model 绑定的数据 <el-form :model="tableData" label-width="80px" v-if="us

vue对象属性为null_vue 解决无法对未定义的值,空值或基元值设置反应属性报错问题...

weixin_29802189的博客

01-14

5714

Cannot set reactive property on undefined, null, or primitive value: //无法对未定义的值、空值或基元值设置反应属性：比如我们在写一个表单，提交成功后要清空表单我把数据绑在上面了方便看，确定提交成功我们一般要清空input，而我在js里开始这样写我写的时候提交成功直接把这个对象变成空了，再次打开弹窗就会报这类型错上面绑的数据已经成...

vue 解决无法对未定义的值,空值或基元值设置反应属性报错问题

10-15

但有时会发现，在操作过程中无法对未定义的值、空值或基本数据类型（基元值，如字符串、数字等）设置反应属性，这会引发错误提示：“Cannot set reactive property on undefined, null, or primitive value”。...

Vue 指令函数的简写形式

mqingo的博客

01-07

4789

10指令函数的简写形式.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=

vue 获取数组索引_Vue中对数组特殊的操作

weixin_39769406的博客

12-20

2830

Vue中对数组类型的数组是怎么操作的呢？我们看下Vue源码中的实现1. 为什么Vue中不能通过索引来修改数组以更新视图我们知道在Vue中的数据是通过Object.defineProperty这种劫持的方式来实现数据更新的，可是数组是一个比较特殊的类型。官网上说：由于 JavaScript 的限制，Vue 不能检测以下变动的数组：当你利用索引直接设置一个项时，例如：vm.items[indexOfI...

Vue-数据驱动视图（一）数据监听机制

秋水惊鸿的博客

05-08

1308

前言 Vue的一大特点就是数据双向绑定，当数据发生变化时，也可以同时触发界面的变化，即数据驱动视图。要想实现数据驱动视图，那么有这么几个步骤： 1.收集我们需要监听的数据，并给他配置个监听器，当数据状态发生变化时触发监听器，然后判断是否需要重新渲染； 2.数据变更时重新构建虚拟DOM； 3.虚拟DOM渲染成为真实的DOM；在这里本文主要分析其中的第一步——数据监听机制，也就是Data变化到watcher监听到的这一过程。正文一、Object的数据响应机制 Vu...

Vue v-model指令的学习

mqingo的博客

01-02

4411

v-model指令的学习.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>v-model指令的学习</title> <script type="text/javascript" src=&q

关于vue项目遇到 Cannot set reactive property on undefined, null, or primitive value: null的解决

qq_56640225的博客

02-20

1512

在vue项目中遇到Cannot set reactive property on undefined, null, or primitive value: null警告，查询后得以解决

vue 无法对未定义的值、空值或基元值设置反应属性报错

weixin_43783614的博客

10-14

2万+

vue 无法对未定义的值、空值或基元值设置反应属性报错 Cannot set reactive property on undefined, null, or primitive value: //无法对未定义的值、空值或基元值设置反应属性：比如我们在写一个表单，提交成功后要清空表单我把数据绑在上面了方便看，确定提交成功我们一般要清空input，而我在js里开始这样写我写的时候提交成功直...

elementUI el-radio不能绑定数值问题

LunaXuuuu的博客

11-17

1527

如果是el-input框，v-model就能绑定数值，但是el-radio的label值不行解决方法：使用 :label <el-radio v-model="updateEc.ectype" :label="0">0奖</el-radio> <el-radio v-model="updateEc.ectype" :label="1">1罚</el-radio> ...

在使用element-ui分页器时遇到的数值绑定错误

qq_64114994的博客

02-09

822

如图为正常分页器，如果我们把total绑定错误，他的共多少条和中间的可选页码都会消失。

Vue2.0 Props双向绑定报错简易处理办法

weixin_30369087的博客

09-20

195

在写项目的时候遇到了一个报错问题，虽然功能是正常运行，chrome的提示是：[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed prop...

关于vue element-ui Radio单选框默认值选不中的原因