Extjs 6 ViewModel 不能正常工作

Question

我正在使用 Extjs6 开发应用程序。我有一个签名页。我有两个文本字段如下：

items: [{
    xtype: 'textfield',
    name: 'email',
    emptyText: 'Email',
    bind : '{inEmail}',
    labelWidth: 60,
    anchor: '100%',
    hideLabel: true,
    allowBlank : false,
    margin: '15 5 0 5',
    listeners: listeners
}, {
    xtype: 'textfield',
    reference: 'password',
    name: 'password',
    bind : '{inpassword}',
    emptyText: 'Password',
    inputType: 'password',
    labelSeparator: '',
    labelWidth: 60,
    anchor: '100%',
    hideLabel: true,
    allowBlank : false,
    margin: '15 5 0 5',
    listeners: listeners
}]

我有一个这样的按钮：

{
    xtype: 'button',
    text: '<span style="color: white ">Enter</span>',
    anchor: '100%',
    handler: 'signin',
    bind: {
        disabled: '{!signinBtn}'
    },
    margin: '-5 5 25 5'
}

在viewModel中我定义了一个公式：

formulas: 
{
    signinBtn: function (get) {
        var fn = get('inEmail'), ln = get('inpassword');
        return (fn && ln);
    }
}

但是当我浏览到这个页面时，有时它不起作用。但是当我将 disabled 更改为 hidden 时，它工作正常。

问题出在哪里？

Answer 1

简短的回答是：不要将 allowBlank: false 添加到 textfield。

我创建了一个 fiddle 来回答您的问题。我添加了一个 console.log(fn && ln); 以在计算公式时在控制台上查看。

fiddle 如您所愿如果您没有将 allowBlank: false 添加到 textfield。如果添加属性，则在清除 textfield 内容时不会计算公式。

Extjs 6 ViewModel 不能正常工作

Extjs 6 ViewModel does not work fine

viewmodel

extjs6