tooltip 应该初始隐藏,仅在用户与其所提示的元素交互时才显示。添加 show 和 hide 方法,以便调用它们来管理 tooltip 的显示。强制隐藏样式的最佳方式是使用内联样式,因为这在 CSS 中具有最高优先级。
show = () => { this.style.cssText = '';};
hide = () => { this.style.display = 'none';}; show 和 hide 方法使用箭头函数定义。
这会将函数绑定到元素,使得接下来使用 add/removeEventListener 时更加简单。
为确保 tooltip 初始隐藏,请在 connectedCallback 中调用 hide 方法。这个标准的自定义元素生命周期回调会在元素连接到 DOM 时执行。
connectedCallback() { super.connectedCallback(); this.hide();} 在 connectedCallback 中调用 super.connectedCallback()。
调用 super.connectedCallback() 来保留 LitElement 的默认实现非常重要。
tooltip 现在应该已隐藏。