“错误是 'EventTarget'.ts 类型上不存在属性'焦点'”：焦点不能在文档中工作，querySelector

Question

为什么焦点会出错？错误是“EventTarget”类型上不存在属性“焦点”。ts

请任何人帮助我。

@HostListener('keydown.tab', [ '$event'])
 keyfunction(event: KeyboardEvent): void {
   // First element: always first element is h2 where tabindex avaliable.
   let focusable = document.querySelector('.modal').querySelectorAll('[tabindex],button');
   if (focusable.length) {
       const first = focusable[0];
       const last = focusable[focusable.length - 1];
       const shift = event.shiftKey;
    
       if (shift) {
         if (event.target === first) {
           last.focus();// **Error is: Error is Property 'focus' does not exist on type **
           
           event.preventDefault();
         }
     } else {
         if (event.target === last) {
            first.focus();// Getting error is here
           event.preventDefault();
         }
       }
     }

Answer 1

last 和 first 默认具有 Element 类型，因为 querySelectorAll 返回类型为 NodeListOf<Element> 的值。

我的建议是在声明时更改类型。

const first: HTMLElement = focusable[0] as HTMLElement;
const last: HTMLElement = focusable[focusable.length - 1] as HTMLElement;