javascript - 我正在使用 webpack 和 babel 创建一个自定义表格组件，并将其导出为 npm 包。如何从用户那里获取表的 json？

Question

我创建了一个带有分页的表格。我可以将它导出为 NPM 包。有用。我在组件本身内部使用了数据。现在我必须将表导出为 NPM 包。之后，我可以在任何地方导入和使用该表。现在我的问题是如何将数据发送到该 NPM 包。这样我就可以拥有包含动态数据的表格？

下面的代码在我的 CustomTable.js 代码中。我删除了所有不需要的代码以使其清晰并使其简单。

class CustomTable extends HTMLElement {
    constructor() {
        super();
        this.attachShadow({
            mode: 'open'
        });
        this.shadowRoot.appendChild(template.content.cloneNode(true));
    }
    connectedCallback() {
        this.shadowRoot.querySelector('.tablea').addEventListener('click', () => {

        })
        this.loadTableAndPagination(this.shadowRoot);
    }

    loadTableAndPagination(shadowRootVari) {
       
        this.shadowRoot.querySelector(".tablea").prepend(buildHtmlTable([mydata]));

        // Builds the HTML Table out of myList json data from Ivy restful service.
        function buildHtmlTable(arr) {
            var table = _table_.cloneNode(false),
                columns = addAllColumnHeaders(arr, table);
            for (var i = 0, maxi = arr.length; i < maxi; ++i) {
                var tr = _tr_.cloneNode(false);
                for (var j = 0, maxj = columns.length; j < maxj; ++j) {
                    var td = _td_.cloneNode(false);
                    td.appendChild(document.createTextNode(arr[i][columns[j]] || ''));
                    tr.appendChild(td);
                }
                table.appendChild(tr);
            }
            paginationCre(table);
            return table;
        }
    }
}
export default CustomTable;

我将上面的代码导出为 npm 包。我可以如下使用它。

<custom-table></custom-table>

我在名为buildHtmlTable([mydata])的函数中传递 mydata ；

现在我的问题是如何从我导入和使用这个包的地方动态发送 buildHTMLTable 方法的数据。抱歉，如果我没有明确提出这个问题。我希望我把我的问题说清楚。如何从使用该特定包的文件将数据发送到 npm 包？

标签： javascriptnode.jsnpmwebpackweb-component