是否可以从商店获取组合框参考? ExtJS 6
Is it possible to get a combox reference from a store? ExtJS 6
以下场景:
{
xtype: 'combo',
displayField: 'LANGTEXT',
valueField: 'KURZTEXT',
store: {
remoteSort: false,
autoLoad: false,
pageSize: 999999,
fields: [
{ name: 'KURZTEXT', type: 'string' },
{ name: 'LANGTEXT', type: 'string' }
],
proxy: {
type: 'ajax',
url: 'callHandler.cfc',
actionMethods: { read: 'POST' },
reader: {
type: 'json',
rootProperty: 'DATA.ROWS',
totalProperty: 'TOTALCOUNT'
}
},
listeners: {
load: function(store, records, successful, operation, eOpts ){
//is something like this possible?
var combo = store.getCombo()
}
}
}
}
是否可以使用类似以下内容从商店获取组合框引用:store.getCombo()
?我知道通常您只能从组合框中获取商店参考。但我想如果商店是在组合框中创建的,也许它也可以反过来工作?
我能想到的唯一解决方案是编写自定义匹配器函数。
您可以通过覆盖 Ext.Component 并像这样添加匹配器函数来做到这一点:
Ext.override(Ext.Component, {
hasStoreId: function (storeId) {
if (Ext.isFunction(this.getStore) && this.getStore().storeId) {
return this.getStore().storeId === storeId;
}
return false;
}
});
现在您已经为每个组件提供了一个匹配器函数,您可以像这样搜索具有给定 storeId 的所有组件:
Ext.ComponentQuery.query("{hasStoreId('mystore')}");
您也可以更精确,只搜索符合条件的组合,如下所示:
Ext.ComponentQuery.query("combo{hasStoreId('mystore')}");
现在您已经拥有所有具有给定 storeId 的组合,您应该能够轻松地检索到您需要的组合。
这里是一个带有工作示例的 Sencha fiddle:
example code
您可能需要检查组合框 afterQuery 模板方法。
这是组合框组件可用的配置,其工作方式与商店的加载事件几乎相似。在这里您可以访问组合框组件和商店。
我认为缺点是:只有在单击组合触发器或在组合的文本字段中键入值时才会调用它。如果您想在这些事件之后进行 post 处理,我相信这已经有所帮助。
{
xtype: 'combo',
displayField: 'LANGTEXT',
valueField: 'KURZTEXT',
store: {
remoteSort: false,
autoLoad: false,
pageSize: 999999,
fields: [
{ name: 'KURZTEXT', type: 'string' },
{ name: 'LANGTEXT', type: 'string' }
],
proxy: {
type: 'ajax',
url: 'callHandler.cfc',
actionMethods: { read: 'POST' },
reader: {
type: 'json',
rootProperty: 'DATA.ROWS',
totalProperty: 'TOTALCOUNT'
}
}
},
afterQuery: function (queryPlan) {
var combo = queryPlan.combo; // I guess `var combo = this;` should work too..
var store = combo.getStore();
// always return queryPlan
return queryPlan;
}
}
如果您有任何问题或疑问,请告诉我。
以下场景:
{
xtype: 'combo',
displayField: 'LANGTEXT',
valueField: 'KURZTEXT',
store: {
remoteSort: false,
autoLoad: false,
pageSize: 999999,
fields: [
{ name: 'KURZTEXT', type: 'string' },
{ name: 'LANGTEXT', type: 'string' }
],
proxy: {
type: 'ajax',
url: 'callHandler.cfc',
actionMethods: { read: 'POST' },
reader: {
type: 'json',
rootProperty: 'DATA.ROWS',
totalProperty: 'TOTALCOUNT'
}
},
listeners: {
load: function(store, records, successful, operation, eOpts ){
//is something like this possible?
var combo = store.getCombo()
}
}
}
}
是否可以使用类似以下内容从商店获取组合框引用:store.getCombo()
?我知道通常您只能从组合框中获取商店参考。但我想如果商店是在组合框中创建的,也许它也可以反过来工作?
我能想到的唯一解决方案是编写自定义匹配器函数。
您可以通过覆盖 Ext.Component 并像这样添加匹配器函数来做到这一点:
Ext.override(Ext.Component, {
hasStoreId: function (storeId) {
if (Ext.isFunction(this.getStore) && this.getStore().storeId) {
return this.getStore().storeId === storeId;
}
return false;
}
});
现在您已经为每个组件提供了一个匹配器函数,您可以像这样搜索具有给定 storeId 的所有组件:
Ext.ComponentQuery.query("{hasStoreId('mystore')}");
您也可以更精确,只搜索符合条件的组合,如下所示:
Ext.ComponentQuery.query("combo{hasStoreId('mystore')}");
现在您已经拥有所有具有给定 storeId 的组合,您应该能够轻松地检索到您需要的组合。
这里是一个带有工作示例的 Sencha fiddle: example code
您可能需要检查组合框 afterQuery 模板方法。
这是组合框组件可用的配置,其工作方式与商店的加载事件几乎相似。在这里您可以访问组合框组件和商店。
我认为缺点是:只有在单击组合触发器或在组合的文本字段中键入值时才会调用它。如果您想在这些事件之后进行 post 处理,我相信这已经有所帮助。
{
xtype: 'combo',
displayField: 'LANGTEXT',
valueField: 'KURZTEXT',
store: {
remoteSort: false,
autoLoad: false,
pageSize: 999999,
fields: [
{ name: 'KURZTEXT', type: 'string' },
{ name: 'LANGTEXT', type: 'string' }
],
proxy: {
type: 'ajax',
url: 'callHandler.cfc',
actionMethods: { read: 'POST' },
reader: {
type: 'json',
rootProperty: 'DATA.ROWS',
totalProperty: 'TOTALCOUNT'
}
}
},
afterQuery: function (queryPlan) {
var combo = queryPlan.combo; // I guess `var combo = this;` should work too..
var store = combo.getStore();
// always return queryPlan
return queryPlan;
}
}
如果您有任何问题或疑问,请告诉我。