在原生 <select> 元素中使用 <slot>

Question

我正在尝试通过使用 Shadow dom 将内容插入其中来创建一个“增强的”select 元素。 这是文件（完整代码在Glitch：

import { LitElement, html } from 'lit-element'
export class Select extends LitElement {
  render () {
    return html`
      <select id="_native">
        <slot></slot>
      </select>
`
  }
}
customElements.define('nn-select', Select)

但是，似乎没有任何问题。 将select 重命名为select2“解决”了这个问题。

是否有限制让我们不能<slot> 进入原生元素？

Answer 1

是的，有一个限制：<select> 元素仅接受 <option> 元素作为子元素。因此，您不能使用<slot>。

与<tr> 和<td> 的限制相同...

查看其他SO post on the same subject。