当事件被亮元素触发时获得高度

问题描述

触发事件时如何获取元素的高度？

我想获得一个可编辑的div但高度为EventTarget has not properties的高度。

import { LitElement,html,customElement } from 'lit-element';

@customElement('my-example')
export class Example extends LitElement {
  render() {
    return html`
      <div
        @keyup="${(e: KeyboardEvent) => console.log(e.target?.offsetHeight)}"
        contenteditable="true"
      ></div>
    `;
  }
}

错误：

Property 'offsetHeight' does not exist on type 'EventTarget'.

解决方法

是<div>本身不能集中注意力吗？我发掘了此评论：“在大多数浏览器中，div都不提供焦点，IE是个例外。您仍然可以通过确实支持焦点的正文或表单元素捕获onkey事件。” （https://www.sitepoint.com/community/t/onkeyup-on-div/2133/2）

我在这里写了一个示例：https://webcomponents.dev/edit/8LCH2QRq8vXSUqs2y8Vy

在将<input>放在<div>内之前，我无法集中注意力。