Question

我正在尝试使用面板和切换按钮创建数据视图组件。切换按钮的初始状态由商店中的字段设置，单击切换按钮时，需要调用某些函数来更新后端的状态。但是因为我在页面加载时从后端初始化切换按钮的状态，在启动时调用change事件，由于该按钮通过连续调用CHANGE EVENT部分内的逻辑来无限切换。请帮助我们如何防止在页面加载时调用更改事件，并仅在用户单击切换按钮时调用？

    /**

var togglevalue = 0, count = 0;
Ext.define('PMDQ.view.EquipmentDVItem', {
    extend: 'Ext.dataview.component.DataItem',
    requires: [
        'Ext.field.Toggle'
    ],
    alias: 'widget.equipmentdvitem',

    config: {
        layout: 'fit',
        cls: 'cartitem-cls',
        dataMap: {

            // Map product's data to dataItem setter
            getEqpmntdvinneritem: {
                setDisplayName: 'ChecklistText'
            },
            getTogglebutton: {
                setValue: "ItemValue"
            }
        },

        eqpmntdvinneritem: {
            flex: 2
        },

        togglebutton: {
            itemId: "itemspinnerfield",
            flex: 1,
            name: 'single_toggle'
        },

        layout: {
            type: 'hbox',
            align: 'center'
        }
    },
    applyEqpmntdvinneritem: function (config) {
        console.log(PMDQ.view.EquipmentDVInnerItem);
        return Ext.factory(config,
            PMDQ.view.EquipmentDVInnerItem,
            this.getEqpmntdvinneritem());
    },
    updateEqpmntdvinneritem: function (newItemLine, oldItemLine) {
        if (oldItemLine) {

            this.remove(oldItemLine);
        }

        if (newItemLine) {
            // Attach lines to DataView
            newItemLine.on('tap', this.onTogglebuttonTap, this);
            this.add(newItemLine);
        }
    },

    applyTogglebutton: function (config) {
        return Ext.factory(config, Ext.field.Toggle, this.getTogglebutton());
    },

    updateTogglebutton: function (newTogglebutton, oldTogglebutton) {
        if (oldTogglebutton) {
            this.remove(oldTogglebutton);
        }

        if (newTogglebutton) {
            // add an event listeners for the `tap` event onto the new button, and tell it to call the onNameButtonTap method
            // when it happens

            newTogglebutton.on('load', this.onTogglebuttonTap, this);
            newTogglebutton.on('change', this.onTogglebuttonChange, this);

            this.add(newTogglebutton);
        }
    },

        onTogglebuttonTap: function () {
        var record = this.getRecord(), me = this;
        count = 0;
    },

    onTogglebuttonChange: function (slider, newValue, oldValue, thumb) {
        var record = this.getRecord(), me = this , store = me.getStore();

            if (oldValue == 0 && newValue == 1) {
                var val = record.get("InputAllowed");
                if (val == "X") {
                    alert("onMPValueEnteronMPValueEnter" + count);
                    me.fireEvent("onMPValueEnter", this, record);
                    togglevalue = 0;
                }
                else {
                    me.fireEvent("onToggleSave", this, oldValue, newValue, record);
                    togglevalue = 0;
                }
            }
            else if (oldValue == 1 && newValue == 0) {
                alert("onToggleSave Off" + count);
                me.fireEvent("onToggleSave", this, oldValue, newValue, record);
                togglevalue = 0;
            }

    }



});

Answer 1

您可以在侦听器中添加条件，然后在第一次设置项目时设置条件＆＃34;设置＆＃34;然后你可以按照你通常的需要行事。

因此，例如在切换的配置中，您可以添加一个属性来检查和更改实例化。

    togglebutton: {
        toggleSet: false, // <-- for example here.
        itemId: "itemspinnerfield",
        flex: 1,
        name: 'single_toggle'
    }

然后修改你的听众，检查它是否只被加载并设置了第一次或以后的次数：

onTogglebuttonChange: function (slider, newValue, oldValue, thumb) {
    // Added a conditional to check if the toggle has been initially set or not.
    if (!slider.toggleSet){
        // Now set the toggleSet so next time the listener runs, it will continue below.
       slider.toggleSet = true;
       return;
    }

    var record = this.getRecord(), me = this , store = me.getStore();

        if (oldValue == 0 && newValue == 1) {
            var val = record.get("InputAllowed");
            if (val == "X") {
                alert("onMPValueEnteronMPValueEnter" + count);
                me.fireEvent("onMPValueEnter", this, record);
                togglevalue = 0;
            }
            else {
                me.fireEvent("onToggleSave", this, oldValue, newValue, record);
                togglevalue = 0;
            }
        }
        else if (oldValue == 1 && newValue == 0) {
            alert("onToggleSave Off" + count);
            me.fireEvent("onToggleSave", this, oldValue, newValue, record);
            togglevalue = 0;
        }

}

Dataview组件更改事件在无限循环中执行

1 个答案: