Question

我仍在努力了解Extjs中refs的含义。似乎缺乏关于这个主题的文件。

Refs应该让生活更轻松，但我发现情况恰恰相反，我想知道是不是因为我没有充分利用它们。

如果我在控制器中使用ref作为组合，我可能会有这样的代码：

refs: [{
    ref: 'maritalStatusCombo',
    selector: 'combo[name="maritalstatus"]',
}]

myFunction: function () {
    var comp = this.getMaritalStatusCombo();
}

但是，我可以像这样轻松编写代码：

var maritalStatusComboSelector = 'combo[name="maritalstatus"]'

myFunction: function () {
    var comp = Ext.ComponentQuery.query(maritalStatusComboSelector)
}

第二个版本使用较少的文本（..我认为），并且更清楚地了解IMO。

此外，我的IDE更了解第二个。

如果我在选择器字符串上选择'导航到...'，它会直接转到顶部的声明。在第一个例子中，'导航到.. getMaritalStatusCombo（）函数不会带我到任何地方。

如何让裁判变得更轻松？

Answer 1

refs config在控制器上创建一个getter方法，该方法在内部使用Ext.ComponentQuery使用配置的选择器获取组件实例。以下示例将getList方法添加到控制器，并将返回应用程序层次结构中的第一个组件，其xtype为＆＃34; grid＆＃34;。默认情况下，当查询未找到目标组件时，将返回undefined。

Ext.define('MyApp.controller.Foo', {
    extend: 'Ext.app.Controller',

    refs: [{
        ref: 'list',
        selector: 'grid'
    }]
});

因此，您可以使用＆＃39;选择器＆＃39;在第一个元素上创建一个getter方法。的xtype。我在表单中使用了很多，例如，在我的登录控制器上，我只需使用getForm即可获取表单。

显然你可以像你告诉我们的那样创建你自己的方法，但是使用refs是完全相同的，你可以使用refs prop数组创建大量的方法，而不需要为每个所需的组件创建大量的getter。

简单地说，这是一种将吸气剂放在一个地方的简单方法。

Extjs的参考点是什么？

1 个答案: