Extjs 6 ViewModel无法正常工作

时间:2015-12-07 14:23:02

标签: viewmodel extjs6

我正在使用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时,它可以正常工作。

问题出在哪里?

1 个答案:

答案 0 :(得分:2)

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

我创建了fiddle来回答您的问题。在评估公式时,我在控制台上添加了console.log(fn && ln);

小提琴按预期工作如果您未将allowBlank: false添加到textfield。如果添加该属性,则在清除textfield内容时不会评估公式。