在 vue 中操作 dom 元素的时候,报错 style of null

这个报错的原因,跟你代码的健壮性有关了;

这样就不会报错了


if( document.querySelectorAll(".now")[1] ){
document.querySelectorAll(".now")[1].style.color="#606266"
document.querySelectorAll(".now")[1].style.background="#fff"
}

你之前是这样写的


document.querySelectorAll(".now")[1].style.color="#606266"
document.querySelectorAll(".now")[1].style.background="#fff"

找不到对象(没有这个对象) 引起的 XXX of null

TypeError: Cannot read property 'length' of null at eval (personindex.vue?139c:438)

( res.data.notDone.applys.length > 8 ){
报错
}

优化后

(res.data.notDone.applys&&res.data.notDone.applys.length>8){ 正确}

正确

if(str&&str.slice(0,4)=="http"){
return str
}
为啥要使用&&;因为没有时,就会报错,找不到对象
if(res.data&&res.data.length>5){
this.newListArr = res.data ? res.data.slice(0,5) : []
}else{
this.newListArr = res.data ? res.data: []
}

循环应该注意的事项

有可能 res.data 为 null

if(res.success==true && res.data ){
for(let k=0;k<res.data.length;k++){ 这里可能报错
if(res.data[k].frontCoverUrl){
res.data[k]['showurl']='';
console.log(111); }
}
}

js引起的 xxxx of null的更多相关文章

  1. Cannot read property 'xxxx' of null

    在使用的vue3+element-plus的项目中,我使用了form表单对数据进行校验. 但是使用了: refDom.value.validate((valid) => {}) 后,过一会控制台 ...

  2. js中的undefined与null、空值的比较

    最近在修改一个项目,总是报Js错误: 无法获取属性“length”的值: 对象为 null 或未定义 点开调试之后,惊奇的发现markerArr的值是undefined 所以我就将代码改成如下形式: ...

  3. [转]JS基础之undefined与null的区别

    在JavaScript开发中,被人问到:null与undefined到底有啥区别? 一时间不好回答,特别是undefined,因为这涉及到undefined的实现原理.于是,细想之后,写下本文,请各位 ...

  4. js判断undefined类型,undefined,null,NaN的区别

    js判断undefined类型 今天使用showModalDialog打开页面,返回值时.当打开的页面点击关闭按钮或直接点浏览器上的关闭则返回值是undefined   所以自作聪明判断       ...

  5. bootstrap插件fileinput.js 出现出现$("#xxxx").fileinput({}); 不生效的情况解决

    如果出现$("#xxxx").fileinput({}); 不生效的情况请将fileinput.js中最后几行注释掉: /* $(document).ready(function ...

  6. js操作css样式,null和undefined的区别?

    1.js操作css的样式 div.style.width="100px"在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性, ...

  7. js判断undefined类型,undefined,null, 的区别详细解析

    js判断undefined类型 今天使用showModalDialog打开页面,返回值时.当打开的页面点击关闭按钮或直接点浏览器上的关闭则返回值是undefined所以自作聪明判断 var reVal ...

  8. 【JS Note】undefined与null

    在Javascript中有这两种原始类型: Undefined与Null.而这两种原始类型都各自只有一个值,分别是undefined,null. undefined: 1.变量声明后未赋值,则变量会被 ...

  9. js中的undefined 和null

    undefined是基本数据类型 表示未定义 缺少的意思 null是引用数据类型  是对象 表示空对象 undefined是从null派生出来的  所以undefined==null  true Ja ...

  10. JS中的Undefined和Null的区别

    Undefined ①在声明变量时,如果没有给变量赋值,则这个变量就是undefined类型: ②访问未声明的变量会报错误消息,但这样的变量使用 typeof 测试,返回的值为Undefined. 即 ...

随机推荐

  1. ReactJS到React-Native,架构原理概述

    React是一个纯JS的UI库,只能干HTML/CSS/JS 提供的Web服务(新的H5 API不一定支持), React-Native厉害在于它能打通JS和Native Code, 让JS能够调用丰 ...

  2. Solon2 开发之IoC,一、注入或手动获取配置

    约定 resources/app.yml( 或 app.properties ) #为应用配置文件 配置样例 track: name: xxx url: http://a.a.a db1: jdbcU ...

  3. Winform 嵌入html,数据交互

    Winform 嵌入html,数据交互,将JS中的数据等传给winform 点击浏览器中的按钮,触发 Winform 中的方法 https://github.com/cefsharp/CefSharp ...

  4. xv6book阅读 chapter1

    xv6book主要研究了xv6如何实现它的类Unix接口,但是其思想和概念不仅仅适用于Unix.任何操作系统都必须将进程多路复用到底层硬件上,相互隔离进程,并提供受控制的进程间通信机制. 1 了解xv ...

  5. Tomcat--隐藏版本号

    为何要隐藏版本号: tomcat默认报错页面信息会暴露出版本号 如果tomcat的版本号暴露出来,会有人利用该版本所存在的漏洞进行攻击,系统存在一定的风险,所以要对tomcat的版本号进行隐藏或者删除 ...

  6. Navigation的用法

    一.Navigation的诞生 单个Activity嵌套多个Fragment的UI架构模式,已经被大多数的Android工程师所接受和采用.但是,对Fragment的管理一直是一件比较麻烦的事情.我们 ...

  7. 解决Github中使用Octotree时,出现 Error: API limit exceeded 报错 或者 Error: Connection error报错的问题(详细操作)

    对于科研工作者来说,Github 是不可多得的利器,那么Octotree 插件的使用将会让用户在使用 Github 时拥有更好的体验,提高学习工作的效率.但是笔者在使用的过程中遇到以下这样的问题,下面 ...

  8. 【每日一题】21.边的染色 (DFS连通图 + 思维)

    补题链接:Here 思维不够,看到这种陌生的题目无从下手. 这题应该做过一次的人会觉得它其实并不难. 主要思想:把边权->点权. 这样做的好处是,无论你怎么分配点权,在环内的异或值一定为 \(0 ...

  9. 广州|阿里云 Serverless 技术实战营邀你来玩!

    活动简介 "Serverless 技术实战与创新沙龙 " 是一场以 Serverless 为主题的开发者活动,活动受众以关注Serverless 技术的开发者.企业决策人.云原生领 ...

  10. 请问Sass/SCSS(with node-sass)和Sass/SCSS(with dart-sass)选哪个?

    node-sass是自动编译实时的,dart-sass需要保存后才会生效. 如果您在Dart-VM内运行Dart-Sass,它的运行速度很快,但它表示可以编译为纯JS,dart-sass只是一个编译版 ...