Uncaught TypeError: Cannot read properties of undefined (reading ‘focus‘)

我的页面是有个v-for循环下又用到了v-if判断,v-if是直接加在input上的,然后又用到了聚焦事件focus,刚开始我一直以为是v-if导致的渲染问题,试了半天改成了v-show倒是也解决了问题。不过同事问题是因为查找对应的input失败导致的focus报错;v-show替换v-if会渲染大量不可见input元素,影响页面渲染:

页面是这样的

 

然后之前是这么获取的: 

 const inputFocus = i => {
            nextTick(() => {
                setTimeout(() => {
                    document.getElementsByTagName('input')[i].focus()
                })
            })
        }

因为页面中除了我需要聚焦的内容列表中有input,筛选框也有个,所以这样获取不够精确,应该获取包裹着所需获取的input的div的class名去找input即可;

setTimeout(() => {
                    document.getElementsByClassName('inputBox')[i].getElementsByTagName('input')[0].focus()
                })

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Uncaught TypeError: Cannot read properties of undefined (reading 'Utf8')错误通常发生在尝试访问未定义或未初始化的对象属性时。这可能是由于以下原因之一引起的: 1. 对象未定义或为空:当你尝试访问一个未定义或为空的对象的属性时,就会出现这个错误。你需要确保对象已经被正确地定义和初始化。 2. 异步操作未完成:如果你在异步操作完成之前尝试访问对象的属性,就会出现这个错误。你可以使用回调函数、Promise或async/await等方法来确保在访问属性之前等待异步操作完成。 3. 对象属性拼写错误:如果你尝试访问一个对象不存在的属性,就会出现这个错误。请检查你的代码,确保属性名称的拼写是正确的。 4. 作用域问题:如果你在错误的作用域中尝试访问对象的属性,就会出现这个错误。请确保你在正确的作用域中访问对象的属性。 以下是一些可能导致这个错误的代码示例: ```javascript // 示例 1: 对象未定义或为空 var obj; console.log(obj.Utf8); // Uncaught TypeError: Cannot read properties of undefined (reading 'Utf8') // 示例 2: 异步操作未完成 var obj; setTimeout(function() { obj = { Utf8: 'some value' }; }, 1000); console.log(obj.Utf8); // Uncaught TypeError: Cannot read properties of undefined (reading 'Utf8') // 示例 3: 对象属性拼写错误 var obj = { Utf8: 'some value' }; console.log(obj.Utf); // Uncaught TypeError: Cannot read properties of undefined (reading 'Utf') // 示例 4: 作用域问题 function myFunction() { var obj = { Utf8: 'some value' }; console.log(obj.Utf8); // 'some value' } myFunction(); console.log(obj.Utf8); // Uncaught TypeError: Cannot read properties of undefined (reading 'Utf8') ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值