Порядок событий между событием DOM и событием sencha - PullRequest
Новая
       21

Порядок событий между событием DOM и событием sencha

0 голосов
/ 10 марта 2020

У меня есть представление данных, написанное с использованием современного * ext js 7.1, с шаблоном с тегом привязки и событием select :

https://fiddle.sencha.com/#view / editor & fiddle / 34bd 

Ext.create({
    renderTo: document.body,

    xtype: 'list',
    itemTpl: '<div class="contact"><a onclick="event.preventDefault();console.log(\'link\');" href="{firstName}">{firstName}</a> <b>{lastName}</b></div>',

    store: {

        data: [{
            firstName: 'Peter',
            lastName: 'Venkman'
        }, {
            firstName: 'Raymond',
            lastName: 'Stantz'
        }, {
            firstName: 'Egon',
            lastName: 'Spengler'
        }, {
            firstName: 'Winston',
            lastName: 'Zeddemore'
        }]
    },
    listeners: {
        select() { console.log('select'); }
    }
});

Я ожидаю, что событие ссылки будет запущено до события выбора списка, но происходит обратное, и даже в худшем случае оба события будут запускаться одно за другим .

Ответы [ 2 ]

2 голосов
/ 11 марта 2020

Я пытаюсь понять, куда пользователь нажимает, как вы предлагаете, но я не знаю, как.

Как сказал @LightNight, вы можете использовать событие childtap для запуска нужен обработчик, прежде чем выбрать. Если вы хотите понять, где произошел щелчок - просто используйте event.target. Смотри мой пример

0 голосов
/ 11 марта 2020

как насчет свойства onItemDisclosure списка вместо ссылки?

использовать функцию onItemDisclosure и выбрать прослушиватель для разделения двух действий.

onItemDisclosure : Boolean / Функция / Строка / Объект BINDABLE

Установите значение true , чтобы отобразить значок раскрытия в каждом элементе списка. Затем в списке будет запущено событие раскрытия, и событие может быть остановлено перед дочерней картой . Установив эту конфигурацию в функцию, переданная функция будет вызываться при нажатии раскрытия. Это может быть либо объект функции, либо имя метода Ext.app.ViewController.

Наконец, вы можете указать объект с определенными свойством области действия и обработчика. Это также будет связано с прослушивателем событий касания и полезно, когда вы хотите изменить область действия обработчика. 

xtype: 'list',
itemTpl: [
    '<div class="contact">',
    '<b>',
    '{firstName} {lastName}',
    '</b>',
    '</div>'
],
onItemDisclosure: function (record, btn, index) {
    console.log('Disclosure');
    Ext.Msg.alert('Tap', 'Disclose more info for ' + record.get('firstName'), Ext.emptyFn);
},
store: {

    data: [{
        firstName: 'Peter',
        lastName: 'Venkman'
    }, {
        firstName: 'Raymond',
        lastName: 'Stantz'
    }, {
        firstName: 'Egon',
        lastName: 'Spengler'
    }, {
        firstName: 'Winston',
        lastName: 'Zeddemore'
    }]
},
listeners: {
        select() {
            console.log('select');
        }
}

здесь fiddle пример

...