extjs 6.2 modern form add own validator

Question

How can I add an own-form validator in extjs 6.2.0 modern application? In classic:

validator : function(value){
    //do something
}    

Answer 1

This surely depends on what you want, but for example what I did recently was adding validator using binding with a ViewModel (seems to work in both classic and modern toolkits). This sure may be overcomplicated for your needs, but it looks like ViewModel's binding with formula suits well for email validation.

Form:

Ext.define('App.login.LoginForm', {
    extend: 'Ext.form.Panel',

    requires: [ 'App.login.LoginModel' ],
    viewModel: {
        type: 'login'  // references alias "viewmodel.login"
    },

    layout: 'vbox',
    defaultType: 'textfield',
    items: [{
        name: 'login',
        itemId: 'login-fld',
        bind: '{credentials.login}'
    },{
        inputType: 'password',
        name: 'password',
        bind: '{credentials.password}'
    },{
        xtype: 'button',
        text: 'Submit',
        action: 'save',
        bind: {
            disabled: '{!isCredentialsOk}'
        }
    }]
});

ViewModel:

Ext.define("App.login.LoginViewModel", {
    extend: "Ext.app.ViewModel", 
    alias: 'viewmodel.login',

    links: {
        credentials: {
            reference: 'App.login.LoginModel',
            create: true
        }
    },

    formulas: {
        isCredentialsOk: function (get) {
            return Boolean(get('credentials.login') && get('credentials.password'));
        }
    }

});

Model:

Ext.define('App.login.LoginModel', {
    extend: 'Ext.data.Model',

    fields: [
        {   name:   'login',    type: 'string', allowBlank: false   },
        {   name:   'password', type: 'string', allowBlank: false   }
    ],

    validators: [
        {   field: 'login',     type: 'presence',   message: 'Login empty'  },
        {   field: 'password',  type: 'presence',   message: 'Password empty'   }
    ]
});