使用 Sencha Touch 处理复杂的业务规则

Question

感谢大家为我开始使用 Sencha Touch 提供的帮助和支持。现在我进入了一些复杂的业务场景处理，我觉得处理起来更加困难。这是我的业务需求。

1. 成功登录应用程序后，sencha 客户端会收到 JSON 对象响应，其中包含所有可用的产品和代码。此外，states 标签包含排除产品列表。我在下面粘贴的 JSON 格式示例。

2. 我必须有一个表单，我必须在其中显示状态和产品下拉框。 UI部分很好。我已经完成了。 但现在复杂的是，当我选择一个州时，我必须从可用产品总数中排除产品列表。

3. 我使用 Ajax 请求 和 decode 方法来解码 JSON 响应。现在我将完整的 JSON 作为对象。

4. 我有 2 个商店，一个用于产品列表，另一个用于状态列表。 我不需要我的任何商店与服务器同步，因为这会增加数据使用量。

5. 选项控制的监听器也完成了，现在我该如何操作 JSON 并动态更新产品商店。请提出建议。

以下是 JSON 响应示例：

{   
    "defaultProducts": {
        "product": [
            {
                "code": "pro1",
                "name": "Product AA"
            }, {
                "code": "pro1",
                "name": "Product BB"
            }, {
                "code": "pro1-INP",
                "name": "Product CC"
            }, {
                "code": "uni1-sc",
                "name": "Product DD"
            }, {
                "code": "pro1",
                "name": "Product EE"
            }, {
                "code": "uni1-sc",
                "name": "TCO - Enhanced"
            }, {
                "code": "uni1",
                "name": "Product FF"
            }, {
                "code": "uni1",
                "name": "Product GG"
            }
        ]
    },
    "states": {
        "state": [
            {
                "excludeProducts": {
                    "excludeProduct": [
                        {
                            "code": "pro1",
                            "name": "Product BB"
                        }, {
                            "code": "pro1-INP",
                            "name": "Product CC"
                        }, {
                            "code": "pro1",
                            "name": "Product EE"
                        }, {
                            "code": "uni1",
                            "name": "Product FF"
                        }, {
                            "code": "uni1",
                            "name": "Product GG"
                        }
                    ]
                },
                "code": "AL",
                "name": "Alabama"
            }, {
                "excludeProducts": {
                    "excludeProduct": [
                        {
                            "code": "pro1",
                            "name": "Product BB"
                        }, {
                            "code": "pro1-INP",
                            "name": "Product CC"
                        }, {
                            "code": "pro1",
                            "name": "Product EE"
                        }, {
                            "code": "uni1",
                            "name": "Product FF"
                        }, {
                            "code": "uni1",
                            "name": "Product GG"
                        }
                    ]
                },
                "code": "AK",
                "name": "Alaska"
            }, {
                "excludeProducts": {
                    "excludeProduct": [
                        {
                            "code": "pro1",
                            "name": "Product BB"
                        }, {
                            "code": "pro1-INP",
                            "name": "Product CC"
                        }, {
                            "code": "uni1-sc",
                            "name": "Product DD"
                        }, {
                            "code": "pro1",
                            "name": "Product EE"
                        }, {
                            "code": "uni1-sc",
                            "name": "TCO - Enhanced"
                        }
                    ]
                },
                "code": "AZ",
                "name": "Arizona"
            }, {
                "excludeProducts": {
                    "excludeProduct": [
                        {
                            "code": "pro1",
                            "name": "Product BB"
                        }, {
                            "code": "pro1-INP",
                            "name": "Product CC"
                        }, {
                            "code": "pro1",
                            "name": "Product EE"
                        }, {
                            "code": "uni1",
                            "name": "Product FF"
                        }, {
                            "code": "uni1",
                            "name": "Product GG"
                        }
                    ]
                },
                "code": "AR",
                "name": "Arkansas"
            }
        ]
    },
    "licensedTo": "mycomp.com"
}

请指导我可以用来实现此类复杂场景的任何其他逻辑。

Answer 1

您应该附加侦听器以便状态下拉框，然后根据您要排除的项目将过滤器添加到产品列表中。

这就是您在状态下拉框中的更改侦听器的外观：

  listeners: {
        change:function(selectfield, value){
            //here you should get reference to the excludeProduct array
            var exProductArray = [];

            //then add filter to the product store like this
            productStore.clearFilter(false); // clears previous filters

            for(var i=0; i<exProductArray.length;++i){
              productStore.filter("code",exProductArray[i].code);       
            }              
        }
   },

要获得对 productArray 的引用，您可以将 state 下拉列表的 valueField 设置为 code 属性，并将状态模型的 idProperty 设置为 code 属性。然后你可以像这样从状态存储中获取状态记录：

  var stateRecord = stateStore.getById(value);

值是value 对象change:function(selectfield, value){。然后，在您获得正确的 stateRecord 以获取对 productArray 的引用后，您应该这样做：

 var exProductArray = stateRecord.excludeProducts.excludeProduct;