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


Posted in Javascript onJuly 31, 2020

Cannot set reactive property on undefined, null, or primitive value: //无法对未定义的值、空值或基元值设置反应属性:

比如我们在写一个表单,提交成功后要清空表单

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

我把数据绑在上面了方便看,确定提交成功我们一般要清空input,而我在js里开始这样写

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

我写的时候提交成功直接把这个对象变成空了,再次打开弹窗就会报这类型错

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

上面绑的数据已经成空了,所有找不到这个对象包括key ,value

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

清空的话,单个清空,或者直接对象为空

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

或者用遍历都可以,就这个rz问题搞了好一会。。。。

补充知识:解决Uncaught TypeError: Cannot set property 'onclick' of null错误的方法

问题分析:当JS文件放在head标签里中时,并且绑定了onclick事件,就出现了这个错误

原因:

W3School中介绍浏览器先加载完按钮节点才执行JS,当浏览器自顶向下解析时,找不到onclick绑定的按钮节点了

如下面这个例子:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>事件</title> 
<script>
 var Btn = document.getElementById('btn');
 Btn.onclick = function(){ 
  console.log("push the button ");  
 }
</script> 
</head> 
<body> 
 <button id="btn">计算</button> 
</body>
</html>

就会出现这个这个错误,如下图:

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

解决办法一:把JS内容用window.οnlοad=function(){ }包裹起来

<!DOCTYPE HTML>
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <title>事件</title>
 <script>
  window.onload = function () {
   var Btn = document.getElementById('btn');
   Btn.onclick = function () {
    console.log("push the button ");
   }
  }
 </script>
</head>
<body>
 <button id="btn">计算</button>
</body>
</html>

解决办法二:把js文件放在底部加载

<!DOCTYPE HTML>
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <title>事件</title>
</head>
<body>
 <button id="btn">计算</button>
 <script>
  var Btn = document.getElementById('btn');
  Btn.onclick = function () {
   console.log("push the button ");
  }
 </script>
</body>
</html>

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

以上这篇vue 解决无法对未定义的值,空值或基元值设置反应属性报错问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
比较详细的关于javascript 解析json的代码
Dec 16 Javascript
编写自己的jQuery插件简单实现代码
Apr 19 Javascript
Javascript 判断是否存在函数的方法
Jan 03 Javascript
方便实用的jQuery checkbox复选框全选功能简单实例
Oct 09 Javascript
JS循环遍历JSON数据的方法
Jul 08 Javascript
简单学习JavaScript中的for语句循环结构
Nov 10 Javascript
javascript创建cookie、读取cookie
Mar 31 Javascript
jquery hover 不停闪动问题的解决方法(亦为stop()的使用)
Feb 10 Javascript
从零开始学习Node.js系列教程六:EventEmitter发送和接收事件的方法示例
Apr 13 Javascript
Three.js利用dat.GUI如何简化试验流程详解
Sep 26 Javascript
JavaScript碰撞检测原理及其实现代码
Mar 12 Javascript
javascript this指向相关问题及改变方法
Nov 19 Javascript
vscode中Vue别名路径提示的实现
Jul 31 #Javascript
Vue记住滚动条和实现下拉加载的完美方法
Jul 31 #Javascript
vue中渲染对象中属性时显示未定义的解决
Jul 31 #Javascript
JS可断点续传文件上传实现代码解析
Jul 30 #Javascript
Vue单文件组件开发实现过程详解
Jul 30 #Javascript
vue实现从外部修改组件内部的变量的值
Jul 30 #Javascript
在vue中实现嵌套页面(iframe)
Jul 30 #Javascript
You might like
PHP编程最快明白(第一讲 软件环境和准备工作)
2010/10/25 PHP
php实现json编码的方法
2015/07/30 PHP
PHP常见字符串操作函数与用法总结
2019/03/04 PHP
利用jQuery的$.event.fix函数统一浏览器event事件处理
2009/12/21 Javascript
nodejs 后缀名判断限制代码
2011/03/31 NodeJs
用javascript删除当前行,添加行(示例代码)
2013/11/25 Javascript
js点击出现悬浮窗效果不使用JQuery插件
2014/01/20 Javascript
jquery获取url参数及url加参数的方法
2015/10/26 Javascript
Bootstrap文件上传组件之bootstrap fileinput
2016/11/25 Javascript
微信小程序实战之轮播图(3)
2017/04/17 Javascript
基于node.js的fs核心模块读写文件操作(实例讲解)
2017/09/10 Javascript
javascript 缓冲运动框架的实现
2017/09/29 Javascript
用js实现每隔一秒刷新时间的实例(含年月日时分秒)
2017/10/25 Javascript
jQuery简单判断值是否存在于数组中的方法示例
2018/04/17 jQuery
解决jquery有正确返回值但不执行success函数的问题
2018/08/20 jQuery
vue element table 表格请求后台排序的方法
2018/09/28 Javascript
typescript配置alias的详细步骤
2020/08/12 Javascript
python实现的MySQL增删改查操作实例小结
2018/12/19 Python
python手机号前7位归属地爬虫代码实例
2020/03/31 Python
Python内存映射文件读写方式
2020/04/24 Python
css3实现蒙版弹幕功能
2019/06/18 HTML / CSS
Html5页面内使用JSON动画的实现
2019/01/29 HTML / CSS
大学系主任推荐信范文
2013/12/24 职场文书
给幼儿园老师的表扬信
2014/01/19 职场文书
保卫科工作岗位职责
2014/03/01 职场文书
中学生操行评语大全
2014/04/24 职场文书
2014年党课学习心得体会
2014/07/08 职场文书
扶贫办主任查摆“四风”问题个人对照检查材料思想汇报
2014/10/02 职场文书
自愿离婚协议书2015
2015/01/26 职场文书
2015员工年度考核评语
2015/03/25 职场文书
2015年学校食堂工作总结
2015/04/22 职场文书
学校食堂管理制度
2015/08/04 职场文书
文明礼貌主题班会
2015/08/14 职场文书
创业计划书之婴幼儿游泳馆
2019/09/11 职场文书
5分钟教你docker安装启动redis全教程(全新方式)
2021/05/29 Redis
Python实现抖音热搜定时爬取功能
2022/03/16 Python