如何用样板创建组件层次结构

How to create a component hierarchy with boilerplatejs?

本文关键字：组件层次结构创建组创建何用样更新时间：2023-09-26

在boilerplatejs zip中，有一个示例组件(salesDashBoard)，包含两个子组件(chartViewPanel和treeViewPanel)父组件定义了一个view.html，其中包含两个div, id分别为#tree和#chart，但是子组件被附加到这个视图中，而不是在这两个div中呈现。

是否有一种方法(也许与DomController ?)附加子组件到特定的DOM元素，而不是只是附加它们?这将是非常有用的，理想情况下，我希望有Dom/Url控制器的层次结构:父级将拦截事件，然后将它们路由到子级，直到子级将事件(针对特定的Url/Dom事件集)路由到具有MVVM的简单组件。

UI在定义的div之外的渲染实际上是一个bug，现在已经修复了。

是的，你可以将子视图模板附加到特定的DOM元素。Boiler.ViewTemplate接受父参数，您必须传递需要在其中呈现的DOM元素。

对于你问题的第二部分，你需要的是contexts的层次结构。你可以在UI组件上保留控制器层次结构。只需将所有UI组件也转换为子模块即可。这意味着你的每个UI组件都有一个module.js文件，并且是父模块的子模块。例如，看看application.js，看看它是如何用Base.Context.loacChildContexts()方法加载它的子模块的。

您可以在BoilerplateJS网站

的"产品模块"一节中阅读更多关于此概念的信息。