sapui5- 如何更改面板图标单击事件的默认操作？

Question

I am using sapui5 panel, and I allow to expandable that it will show default icon on toolbar ">", when I click on it, it will togglecollapse, but I want to add some action on it.

Here is the panel and there is one icon at the end. Any idea to override function, customize function, or add some action on that icon when we click on it?

My purpose is, I want to add warning message before panel is collapsed, if I click "yes" to confirm, it can collapse, "No" it still the same, do nothing.

Answer 1

Have you tried attachExpand ? https://sapui5.hana.ondemand.com/docs/api/symbols/sap.m.Panel.html#attachExpand

I'm still new to this ui5 :p

Here we go

        var panel = new sap.m.Panel("panel-1", {
            headerText:"Test Panel",
            expandable: true
        });
        panel.setExpanded = function (bExpanded) {
            if (bExpanded === this.getExpanded()) {
                return this;
            }
            //may need to reset this later
            this.setProperty("expanded", bExpanded, true);
            if (!this.getExpandable()) {
                return this;
            }

            //add custom logic here
            if(bExpanded){

            }
            //custom logic

            this._getIcon().$().attr("aria-expanded", this.getExpanded());
            this._toggleExpandCollapse();
            this._toggleCssClasses();

            this.fireExpand({ expand : bExpanded });
            return this;
        };