Question

我正在使用extjs 4，我使用单一模式为多个工具栏创建了菜单面板并且它运行良好，但是当我将我的应用程序从extjs 4移动到extjs 5时它停止工作，意味着菜单面板被隐藏当鼠标移过它时。我在小提琴上创建了一个示例，请给我一些解决这个问题的方法。小提琴链接：singleton menu panel example

谢谢，沙

Answer 1

在Ext JS 5中，菜单似乎与其所有者组件（例如按钮）相关联，并且无法在所有者之间共享。这就是为什么，在你的例子中，问题只发生在第一和第二个面板而不是最后一个（第三个） - 它的按钮成为菜单的“合法”所有者，因此它在那里工作正常。

实际上没有必要在您的示例中共享菜单。不要重复相同的代码三次，只留下一个停靠的工具栏，只使用一个位置的菜单，并使其更加智能。请参阅示例：https://fiddle.sencha.com/#fiddle/s1b

更新

如果需要在按钮之间共享菜单，可以使用自定义按钮来强制确保其菜单在每个菜单显示请求中属于自己：

Ext.define('SharingMenuButton', {
    extend: 'Ext.button.Button',
    alias: 'widget.sharingmenubutton',
    showMenu: function() {
        if (this.menu.ownerCmp !== this) {
            this.setMenu(this.menu, false);
        }
        return this.callParent(arguments);
    }
});

查看使用该示例的示例：https://fiddle.sencha.com/#fiddle/s1g

单例菜单面板在extjs中不起作用5

1 个答案: