javascript - 制表符表的 Web 组件支持

Question

我想在 web 组件中使用非常好的 Tabulator ( http://tabulator.info/ ) javascript 表。

但是，看起来主 Tabulator 实例只能通过这样的 html 选择器创建：

var table = new Tabulator("#example-table", {...});

不幸的是，看起来#example-table在 webcomponents 的 shadowDom 中不可见：

class WcProjects extends HTMLElement {
    constructor() {
        super();
        // Attach a shadow root to the element.
        let shadowRoot = this.attachShadow({mode: 'open'});
        shadowRoot.innerHTML = `<div id="example-table"></div>`;
}
connectedCallback() {
    var table = new Tabulator("#example-table", {...});
}

还有另一种实例化 Tabulator 表的方法吗？

任何帮助深表感谢。

Answer 1

Tabulator 构造函数接受选择器或 DOM 节点到表的构造函数元素中，即：

var tableHolder = document.createElement("div");
var table = new Tabulator(tableHolder , {...});

因此，只要您可以访问组件应该为您提供的那个节点，您就可以将其传递给构造函数