Как предотвратить беспорядочное добавление элементов управления с помощью GWT?

Question

Я использую GWT в своем приложении для создания двух панелей с одной и той же кнопкой. Например, есть два класса для двух панелей PanelFirst и PanelSecond и класс для кнопки MyButton, которая показывает предупреждение после нажатия. Я добавляю кнопку на обе панели и ожидаю увидеть страницу с двумя панелями с одинаковыми кнопками на каждой панели. Но я получаю две панели, на которых PanelFirst пуста, а PanelSecond имеет две перекрывающиеся кнопки (кнопка выглядит как одна кнопка, и когда я нажимаю на нее, я получаю два предупреждения, а в HTML-файле DevTool я вижу две кнопки, расположенные в одном месте). Почему это происходит? Является ли коренная причина в асинхронных js? И как я могу решить эту проблему?

Чтобы лучше понять меня, я прилагаю пример кода (это не настоящий код. Это просто общий пример).

class PanelFirst {

   private static Button myFirstButton = new Button();
   private static FlowPanel firstPanel;

   public PanelFirst (){};

   public FlowPanel createPanelFirst(){
     firstPanel = new FlowPanel();
     myFirstButton = MyButton().createMyButton();
     firstPanel.add(myFirstButton);
     return firstPanel;
   }   
}

class PanelSecond  {

   private static Button mySecondButton = new Button();
   private static FlowPanel secondPanel;

   public PanelSecond(){};

   public FlowPanel createPanelSecond(){
     secondPanel= new FlowPanel();
     mySecondButton = MyButton().createMyButton();
     secondPanel.add(mySecondButton);
     return secondPanel;
   }   
}

class MyButton {

   private static Button mySecondButton = new Button();

   public MyButton(){};

   public Button createMyButton(){
     mySecondButton.addClickHandler(new ClickHandler() {
            @Override
            public void onClick(ClickEvent event) {
                createAlert("I'm button");
            }
        });
     return mySecondButton;
   }   
}

Answer 1

хорошо, вы в основном добавляете одну и ту же кнопку 2 раза к 2 панелям и добавляете к ней 2 ClickHandler. Вам нужно изменить свой код следующим образом:

сначала измените ваш createMyButton на статический метод и создайте там новый объект

class MyButton {

    public MyButton(){};

    public static Button createMyButton(){
        MyButton button = new MyButton();
        button.addClickHandler(new ClickHandler() {
            @Override
            public void onClick(ClickEvent event) {
                createAlert("I'm button");
            }
        });
        return button;
    }   
}

, теперь вы можете использовать его на своих панелях:

class PanelFirst {

    private static FlowPanel firstPanel;

    public PanelFirst (){};

    public FlowPanel createPanelFirst(){
        firstPanel = new FlowPanel();
        firstPanel.add(MyButton.createMyButton());
        return firstPanel;
    }   
}

class PanelSecond  {
    private static FlowPanel secondPanel;

    public PanelSecond(){};

    public FlowPanel createPanelSecond(){
        secondPanel= new FlowPanel();
        secondPanel.add(MyButton.createMyButton());
        return secondPanel;
    }   
}