ExtJS：对模型包感到困惑

Question

我很担心如何在ExtJS 4中正确使用模型/商店/代理/读者。我已经阅读了指南并查看了示例，但仍然看不到我的问题的解决方案。

目标：说我正在使用car个对象（模型存在），其中包含（除其他外）：

• 汽车标识符（VIN＃，品牌，型号，年份，颜色等）
• 所有权历史
• 维护历史
• 汽车部件的详细清单（发动机：{L-Twin气缸，每气门2气门Desmodromic，风冷}，前制动器：{}，......）

并假设我使用VIN＃作为主要密钥，并且我有一个RESTfull API设置，如

GET /car                 // gets list of cars
GET /car/123abc          // gets car with VIN# 123abc

现在，如果我在控制器中引用了VIN＃，我想要做的是启动一个复杂仪表板，它可能包含以下组件：

• 汽车零部件的网格
• 维护成本与时间的关系图
• 用于显示品牌，型号，年份的自定义面板
• ECT

问题： 假设我有一个Car模型和一个CarComponent模型，我的服务器配置为发送嵌套数据（即没有用于直接处理CarComponent的API）。理想情况下......我只想用简单的GET /car/<the vin #>从服务器请求汽车数据，并使用返回的数据填充复杂仪表板的所有组件。所以我的尝试策略是：

• 型号：Car，CarComponent
• 商店：Cars
• 代理：附加到Car模型
的单个休息代理
• 以某种方式使用Car的嵌套属性来填充组件（例如组件网格）

或者我是否需要为组件单独存储？另外，我不知道商店是如何运作的;我不想要从服务器加载所有汽车..只是指定的汽车。我只是对如何将模型/代理/商店串在一起以完成我需要的东西感到困惑......

Answer 1

在这种情况下，你有一个单独的汽车网格和一个单独的组件网格，理想的设置是拥有处理CarComponent的API。既然你已经提到过不是这种情况，我建议你定义两个独立的商店。他们会发出相同的GET请求来加载数据，但您将指定不同的root readers。如果您的服务器返回类似于以下内容的数据：

{
    Car:
    {
        color:blue,
        CarComponent:
        {
            engine: {..}
        }
        ..
    }
}

然后一个商店（我们称之为CarStore）将拥有读者根Car而另一个商店（我们称之为CarComponentStore）Car.CarComponent。这种方法的缺点是你必须每次发出两个请求，一个用于Car，另一个用于CarComponent，即使返回的数据是相同的。但是，使用“master”和“slave”存储的概念可以避免这种情况，请参阅解释它的excellent answer。

在Car grid中，您必须在CarComponent中将商店设置为CarStore，并将其设置为CarComponentStore。通过正确定义读者根，两个网格将“自动”填充来自响应的适当数据。

  

我不想从服务器加载所有汽车..

嗯，除非你没有VIN＃的线索，否则你不必这样做。大多数AP都支持分页，因此您可以获取10乘10的汽车，或者您可以包含remote filtering来过滤服务器端的记录。但第一个先决条件是要知道要检索哪辆车： - ）