extjs => Modèle d'événement

Introduction

ExtJS préconise l'utilisation du tir et de l'écoute d'événements entre les classes. En déclenchant des événements et en écoutant les événements déclenchés, les classes ne requièrent aucune connaissance «sale» de la structure de classe des autres et empêchent le couplage du code. En outre, les événements facilitent l’écoute de plusieurs instances du même composant en autorisant un écouteur générique pour tous les objets possédant le même sélecteur. Enfin, d'autres classes peuvent également utiliser des événements existants.

Contrôleurs à l'écoute des composants

Ext.define('App.Duck', {
    extend: 'Ext.Component',
    alias: 'widget.duck',
    initComponent: function () {
        this.callParent(arguments);
        this._quack();
    },
    _quack: function () {
        console.log('The duck says "Quack!"');
        this.fireEvent('quack');
    },
    feed: function () {
        console.log('The duck looks content.');
    },
    poke: function () {
        this._quack();
    }
});
    
var feedController = Ext.create('Ext.app.Controller', {
    listen: {
        components: {
            duck: {
                quack: 'feedDuck'
            }
        }
    },
    feedDuck: function (duck) {
        duck.feed();
    }
});

var countController = Ext.create('Ext.app.Controller', {
    listen: {
        components: {
            duck: {
                quack: 'addCount'
            }
        }
    },
    quackCount: 0,
    addCount: function (duck) {
        this.quackCount++;
        console.log('There have been this many quacks: ' + this.quackCount);
    }
});

var firstDuck = Ext.create('App.Duck');
// The duck says "Quack!"
// The duck looks content.
// There have been this many quacks: 1
var secondDuck = Ext.create('App.Duck');
// The duck says "Quack!"
// The duck looks content.
// There have been this many quacks: 2
firstDuck.poke();
// The duck says "Quack!"
// The duck looks content.
// There have been this many quacks: 3

Modified text is an extract of the original Stack Overflow Documentation

Sous licence CC BY-SA 3.0

Non affilié à Stack Overflow

extjs
Modèle d'événement

Recherche…

Introduction

Contrôleurs à l'écoute des composants