Я должен дважды щелкнуть флажок, чтобы изменить его статус в марионетке; / - PullRequest
Новая
       7

Я должен дважды щелкнуть флажок, чтобы изменить его статус в марионетке; /

0 голосов
/ 24 июня 2018

У меня есть флажок с классом js-map-source в моем шаблоне HBS. Я слушаю щелчки по этому флажку в представлении марионеток. Эта часть работает правильно - когда я нажимаю на флажок, я могу console.log статус флажка.

Код: 

module.exports = Marionette.ItemView.extend({
  # something else....

  ui: {
    mapSource: '.js-map-source'
    # something else...
  },

  events: {
    'click @ui.mapSource': 'mapSourceChanged'
    # something else...
  }

  # something else...

  mapSourceChanged: function (event) {
    var switchStatus = $(this.ui.mapSource).is(":checked");
    console.log(`TypeOf: ${typeof switchStatus}; value: ${switchStatus}`);
  },
}

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

TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false`

Это было ожидаемое поведение.

Проблема возникает, когда я пытаюсь сохранить значение этого флажка (true / false) в моей модели. Давайте добавим this.model.set('source', switchStatus) к функции mapSourceChanged.

Теперь мне нужно дважды щелкнуть флажок, чтобы пометить как отмеченный (визуально). Но все же, я могу снять флажок одним щелчком мыши.

Код: 

module.exports = Marionette.ItemView.extend({
  # something else....

  ui: {
    mapSource: '.js-map-source'
    # something else...
  },

  events: {
    'click @ui.mapSource': 'mapSourceChanged'
    # something else...
  }

  # something else...

  mapSourceChanged: function (event) {
    var switchStatus = $(this.ui.mapSource).is(":checked");
    console.log(`TypeOf: ${typeof switchStatus}; value: ${switchStatus}`);
    this.model.set('source', switchStatus);
  },
}

Журналы: 

2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true

Это 2 в начале строки означает, что я снова получаю тот же журнал.

В чем причина такого поведения? Как это исправить?

...