使用 amperstand.js 视图 [子视图] 渲染复杂模型 [状态]

Question

• 一位木偶\骨干开发人员尝试（努力）采用 & 符号

给定一个具有嵌套属性的复杂模型（如下）。渲染深度嵌套布局的最佳实践是什么。

-- 主视图

---- 用户信息视图

------社会信息视图

-------- socialCollectionsView

& 符号状态不支持“深度模型”。它看起来相当平坦（一个级别，然后您可以使用自己的类型，例如“reviewModel”）。

基本上，我怎样才能在不破坏复杂模型的情况下保持它，并使我的嵌套（视图/子视图）布局清晰易读。

{
  firstName: 'John',
  lastName: 'Doe',
  "social": {
    "linkedin": {
      "connections": 123,
      "positions": [{
        image: 'bla.jpg'
        "title": "CTO & Co - founder"
      }, {
        image: 'bla2.jpg'
        "title": "prime minister"
      }, ],
      "friends": [{
        name: james,
        a: 'b'
      }, {
        name: jane,
        x: 'y'
      }],
      "languages": ['english', 'russian']
    },
    "twitter": {
      "connections": 122
    }
  },
}

Answer 1

如果您不需要关注深层数据的变化，那么您可以简单地将“对象”数据类型用于“社交”等道具，并在您的视图中像this.model.social.linkedin.connections 一样访问。

否则，您确实需要使用children hash（代码）或'state' data type（代码），因为它们会自动设置侦听器。

当您想要观察深度嵌套数据的变化时，与号确实要求您明确说明事物（您试图避免的新类型）。

& 符号的方式是尽可能选择小的、单一关注的模型/视图，并从小的、单一关注的模型/视图中组合不可避免的复杂模型/视图。

Answer 2

“state.children”可能是您正在寻找的。或者尝试“状态”类型的“道具”。