dom - 如何在 Marko 中动态创建 HTML 组件？

Question

我想在用户每次单击按钮时创建新的 Marko 组件——通过调用类似 JavaScript DOM 方法的方法document.createElement("tag")。我如何在 Marko 中做到这一点，不仅使用普通的 HTML 标签，还使用自定义的 Marko 标签？

我尝试了什么：document.createElement("custom-marko-component")

预期行为：Marko 引擎编译自定义组件的新实例。

实际行为：浏览器生成一个无用的新<custom-marko-component></custom-marko-component>.

Answer 1

使用 Marko 的渲染函数（文档：https ://markojs.com/docs/rendering/ ）：

例子：

// Create the custom component, like document.createElement() but asynchronous.
// Import `./custom-marko-component.marko`
var customComponent = require("./custom-marko-component"); 
var resultPromise = customComponent.render({});

// Insert the custom component into the webpage.
resultPromise.then(result => {
  result.appendTo(document.body);
});