在 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. 超详细的 Jenkins 安全tips

    Jenkins 作为一个开放的.可定制的平台,即使在默认状态下也提供了不错的安全性.但是鉴于 Jenkins 连接了许多行业工具,因此也存在一定安全隐患.本篇文章将会介绍一些方法和工具,来确保 Jen ...

  2. Kubernetes(K8S) helm chart

    感觉和放到一个 yaml 文件中,用 ---- 分隔,操作繁琐程度上,没有太大区别 创建自定义 Chart # 创建自定义的 chart 名为 mychart [root@k8smaster ~]# ...

  3. LinkedBlockingQueue实现的生产者和消费者模型

    首先 LinkedBlockingQueue 是线程安全的阻塞队列,LinkedBlockingQueue实现的生产者和消费者模型 阻塞队列与我们平常接触的普通队列(LinkedList或ArrayL ...

  4. 哈佛大学《CS50 Python人工智能入门》公开课 (2020)

    课程介绍 本课程探讨现代人工智能基础上的概念和算法,深入探讨游戏引擎.手写识别和机器翻译等技术的思想.通过实践项目,学生在将图形搜索算法.分类.优化.强化学习以及其他人工智能和机器学习的主题融入到他们 ...

  5. AIsing Programming Contest 2020 游记 (ABC水题,D思维)

    补题链接:Here A - Number of Multiples 水题 B - An Odd Problem 水题 C - XYZ Triplets 水题,注意数组不要开小了 D - Anythin ...

  6. RabbitMQ的ack机制

    1.什么是消息确认ACK. 答:如果在处理消息的过程中,消费者的服务器在处理消息的时候出现异常,那么可能这条正在处理的消息就没有完成消息消费,数据就会丢失.为了确保数据不会丢失,RabbitMQ支持消 ...

  7. 基于函数计算自定义运行时快速部署一个 springboot 项目 什么是函数计算?

    什么是函数计算? 函数计算是事件驱动的全托管计算服务.使用函数计算,您无需采购与管理服务器等基础设施,只需编写并上传代码.函数计算为您准备好计算资源,弹性地可靠地运行任务,并提供日志查询.性能监控和报 ...

  8. SpringCloud学习 系列五、创建生产者和消费者验证微服务中心 Eureka的作用

    系列导航 SpringCloud学习 系列一. 前言-为什么要学习微服务 SpringCloud学习 系列二. 简介 SpringCloud学习 系列三. 创建一个没有使用springCloud的服务 ...

  9. 《3D编程模式》写书-第2次记录

    大家好,目前我已经完成了"拼接模式"."撤销重做模式"."ECS模式"的初稿 下面会给出它们的使用场景,如果您正好能用到,请联系我提前阅读模 ...

  10. svg组件封装

    svg图标优点 文件体积小,能够被大量的压缩 图片可无限放大而不失真(矢量图的基本特征) 在视网膜显示屏上效果极佳 能够实现互动和滤镜效果 svg图标使用 1.安装相应的npm包: yarn add ...