'Element | 类型的参数null' 不可分配给类型为 'Element | 的参数VirtualElement'

Question

我正在努力理解如何正确键入它，因为在尝试使用 popper 组件时出现以下错误。文档不清楚，我也没有太多的 Typescript 经验。

<块引用>

'Element 类型的参数 | null' 不可分配给类型为 'Element | 的参数虚拟元素'。 类型 'null' 不能分配给类型 'Element | VirtualElement'.ts(2345) const 爆米花：元素 |空

const popcorn = document.querySelector('#popcorn')
const tooltip = document.querySelector('#tooltip')

createPopper(popcorn, tooltip, {
  placement: 'top',
})

Answer 1

createPopper 函数想要确保 popcorn 和 tooltip 实际上都是元素。由于 querySelector 可以返回 null（如果不存在元素），只需在对它们调用 popcorn 之前检查以确保 tooltip 和 createPopper 不为空。

const popcorn = document.querySelector('#popcorn')
const tooltip = document.querySelector('#tooltip')

if (popcorn && tooltip) {
  createPopper(popcorn, tooltip, { placement: 'top' })
}