布尔数据和网格列列表过滤器以及 Ext.Data.Store 的 ExtJS 问题

Question

我正在使用 ExtJS 6（尽管据我所知它也适用于 7.4 版）并且我有一个带有布尔列 xtype 的网格。对于那个布尔列，我想使用过滤器列表选项。是的，我知道有一个布尔过滤器选项，但我不喜欢它使用单选按钮的工作方式。我希望能够 select 带有复选框的是或否，但是我发现只有值为 true 的选项才有效。这是我的专栏配置：

{
header: 'Active'
, dataIndex: 'inactive'
, xtype: 'booleancolumn'
, trueText: 'No'
, falseText: 'Yes'
, filter:{
            type: 'list',
            options: [[true,"No"],[false, "Yes"]]
        }
}

当排除 'options' 属性并让它从商店获取数据时，这不起作用。查看代码后，我发现它采用 'options' 配置并使用它作为数据创建自己的 Ext.Data.Store。在这里看到一个简单的例子，它可以是运行会得到同样的问题：

var teststore =  new Ext.data.Store({
        fields: [
            'id',
            'text'
        ],
        data: [[true,"No"],[false, "Yes"]]
    });

问题是 'false' 布尔值被更改并替换为动态创建的通用 ID。我发现问题出在以下行的 'Ext.data.Model' 的构造函数中：

if (!(me.id = id = data[idProperty]) && id !== 0) {

如果该行的计算结果为真，它将用生成的 ID 替换该 ID。为了解决这个问题，我只是在 if 语句的末尾添加了“&& id !== false”，这解决了问题。

我还没有对此进行全面测试，但是逻辑似乎很合理，并且看起来与“0”的值发生了相同类型的问题，因此 ' && id !==0'。因为我们是从 sencha 论坛被引导到这里的，所以我想提出来以防它对某人有帮助。

Answer 1

因为我的 post 已经有了答案，所以我会 post 除了直接更改 Ext 代码文件之外的更好的方法（无论这是否是正确的方法，我可能是错误的）。相反，您可以创建一个需要包含在您的应用程序中的新 js 文件（您可以将其命名为 ext-overrides.js）。在新的 js 文件中，您只需键入：

Ext.override(Ext.data.Model, {
    constructor: function(data, session) {
        .....
    }
}

然后您将从您的 ExtJS 代码版本中复制构造函数代码，位于“.....”的位置（如果构造函数参数可能不同，您也必须更新它们）和只需在 'question' 中添加我在上面所做的建议更改即可。搜索 Ext.define('Ext.data.Model' 的 Extjs 代码应该可以让您轻松到达那里，然后只需滚动到构造函数。

布尔数据和网格列列表过滤器以及 Ext.Data.Store 的 ExtJS 问题

ExtJS Issue with boolean data and grid column list filter as well as Ext.Data.Store

extjs