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 相关文章推荐
jQuery maxlength文本字数限制插件
Apr 16 Javascript
JavaScript设计模式之单件模式介绍
Dec 28 Javascript
jQuery对象和DOM对象之间相互转换的方法介绍
Feb 28 Javascript
JavaScript中getUTCMinutes()方法的使用详解
Jun 10 Javascript
JavaScript中Date对象的常用方法示例
Oct 24 Javascript
js实现音频控制进度条功能
Apr 01 Javascript
SpringMVC简单整合Angular2的示例
Jul 31 Javascript
Three.js实现绘制字体模型示例代码
Sep 26 Javascript
如何编写一个完整的Angular4 FormText 组件
Nov 18 Javascript
微信小程序icon组件使用详解
Jan 31 Javascript
JQuery扩展对象方法操作示例
Aug 21 jQuery
vue中使用element ui的弹窗与echarts之间的问题详解
Oct 25 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合并数组array_merge函数运算符加号与的区别
2008/10/31 PHP
php 表单数据的获取代码
2009/03/10 PHP
php设计模式 Mediator (中介者模式)
2011/06/26 PHP
让codeigniter与swfupload整合的最佳解决方案
2014/06/12 PHP
PHP实现简单搜歌的方法
2015/07/28 PHP
PHP计算近1年的所有月份
2017/03/13 PHP
25个非常棒的jQuery滑块插件和教程小结
2011/09/02 Javascript
jquery的选择器的使用技巧之如何选择input框
2013/09/22 Javascript
javascript检测是否联网的实现代码
2014/09/28 Javascript
jQuery网页选项卡插件rTabs用法实例分析
2015/08/26 Javascript
bootstrapValidator.min.js表单验证插件
2017/02/09 Javascript
单击按钮发送验证码,出现倒计时的简单实例
2017/03/17 Javascript
关于axios返回空对象的问题解决
2017/04/04 Javascript
React-Native实现ListView组件之上拉刷新实例(iOS和Android通用)
2017/07/11 Javascript
vuex 项目结构目录及一些简单配置介绍
2018/04/08 Javascript
详解vue项目打包步骤
2019/03/29 Javascript
vue使用keep-alive保持滚动条位置的实现方法
2019/04/09 Javascript
vue搜索页开发实例代码详解(热门搜索,历史搜索,淘宝接口演示)
2020/04/11 Javascript
[29:10]Ti4 冒泡赛第二天 NEWBEE vs Titan 3
2014/07/15 DOTA
[01:30]我们共输赢 完美世界城市挑战赛开启全新赛季
2019/04/19 DOTA
Python检测一个对象是否为字符串类的方法
2015/05/21 Python
python记录程序运行时间的三种方法
2017/07/14 Python
python机器学习库常用汇总
2017/11/15 Python
对python 自定义协议的方法详解
2019/02/13 Python
VPS CENTOS 上配置python,mysql,nginx,uwsgi,django的方法详解
2019/07/01 Python
如何使用python写截屏小工具
2020/09/29 Python
css3进行截取替代js的substring
2013/09/02 HTML / CSS
英格兰橄榄球商店:England Rugby Store
2016/12/17 全球购物
Boutique 1美国:阿联酋奢侈时尚零售商
2017/10/16 全球购物
施华洛世奇加拿大官网:SWAROVSKI加拿大
2018/06/03 全球购物
人力资源管理专业毕业生推荐信
2013/11/07 职场文书
2014年幼儿园植树节活动方案
2014/03/02 职场文书
初中生思想道德自我评价
2015/03/09 职场文书
人与自然的观后感
2015/06/18 职场文书
2019入党申请书格式
2019/06/25 职场文书
深入理解python协程
2021/06/15 Python