【问题标题】:Display different views of the same model with extjs用 extjs 显示同一模型的不同视图
【发布时间】:2013-03-21 06:01:23
【问题描述】:

我尝试使用 ExtJS 显示同一模型的不同视图(每个视图显示模型的一个子集)。

我有一个加载以下 xml 的嵌套模型:

<results>
  <hitcount>1234</hitcount>
  <recommended>
     <title>foo</title>
  </recommended>
  <result>
    <title>title1</title>  
    <author>author1</author>  
  </result>
  <result>
    <title>title2</title>  
    <author>author2</author>  
  </result>
</results>  

我想要不同的小部件,每个小部件都显示此模型的一部分(一个列表显示“结果”,另一个显示“推荐”,另一个小部件显示命中数)。

我不知道如何在每个小部件上声明商店以仅针对完整模型的子集。

听起来像是一种基本方法,但我找不到这样的示例(我发现了许多嵌套结构的示例,但没有一个将商店范围限定在模型子集上的示例)。

请参阅下面的一些尝试,我尝试仅获取结果部分。

Ext.define("MySenchaApp.model.ResultModel", {
    extend:"Ext.data.Model",

    config:{
        associations: [
            {
                type:'hasMany',
                model:'MySenchaApp.model.Result',
                name:'results',
                associationKey:'result'
            }
        ],


        proxy:{

            type:"ajax",
            url:'Results.xml',

            reader:{
                type:'xml',
                rootProperty:'results'
            }
        }
    }
});

Ext.define("MySenchaApp.model.Result", {
    extend:"Ext.data.Model",

    config:{
        fields:['title', 'author'],
        belongsTo: 'MySenchaApp.model.ResultModel'
    }
});

Ext.define('MySenchaApp.view.Results', {
    extend:'Ext.navigation.View',
    xtype:'blog',


    config:{
        title:'Results',
        items: [
            {
                xtype:'list',
                itemTpl:'<b>{title}</b> - by <i>{author}</i>',

                store:{
                    autoLoad:true,
                    model:'MySenchaApp.model.Result' // ??
                }
            }
        ]
    }
});

【问题讨论】:

  • 如果我理解正确,您不必针对模型的子集。您可以拥有一个包含 100 个字段的模型,但只能在其中一个小部件中使用其中的 3 个。仅仅因为它在模型中并不意味着它必须被使用
  • List 如何猜测我想显示结果而不是“推荐”?

标签: javascript extjs extjs4


【解决方案1】:

您不能将关联存储作为配置提供,因为它们绝不是单例。

说明

考虑以下示例:

Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'id',   type: 'int'},
        {name: 'name', type: 'string'}
    ],
    hasMany: {model: 'Product', name: 'products'}
});

现在完全有道理,有些人希望拥有一个用户商店,每个用户都有自己的产品关联。因此,如果aUser1aUser2 是存储在用户存储中的两条用户记录,那么这样做是完全合法的:

aUser1.products().add( ... );
aUser2.products().add( ... );

关键在于,有了关联,就不存在单一存储——每条记录都有一个存储。

您的 XML 建议不能超过 1 个results,在这种情况下,您不应该真正使用关联。您应该按照以下方式做一些事情:

Ext.define("MySenchaApp.model.Results", {
    extend:"Ext.data.Model",

    fields:['title', 'author'],

    proxy:{

        type:"ajax",
        url:'Results.xml',

        reader:{
            type:'xml',
            rootProperty:'results'
        }
    }

});

并提供以下 XML:

<metadata>
    <hitcount>1234</hitcount>
    <recommended>
        <title>foo</title>
    </recommended>
</metadata>
<results>
    <result>
        <title>title1</title>  
        <author>author1</author>  
    </result>
    <result>
        <title>title2</title>  
        <author>author2</author>  
    </result>
</results>

使用代理的metachange 事件检查命中计数并推荐。

【讨论】:

  • 看起来这将满足我的迫切需要谢谢,我在这里找到了您所描述的示例:stackoverflow.com/questions/11000819/…
  • 我想知道你将如何处理多个列表(例如:结果列表和一个方面的列表,以及每个方面的列表)。
  • 在这种情况下,您将查看 hasMany 关联,然后我的原点是:没有可以为您的小部件提供的单例存储 - 您必须以编程方式执行此操作(通过说小部件“这是你现在的商店”,所以在网格的情况下,它将通过reconfigure)。
猜你喜欢
  • 1970-01-01
  • 2015-07-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-03-25
  • 2018-05-09
相关资源
最近更新 更多