Невозможно получить наблюдаемый Riot.js для передачи параметров через обратный вызов

Question

Моя наблюдаемая Riot.js работает следующим образом.

Внутри моего тега "global-header" обновляется riot.store, наблюдаемый в глобальной области действия riot (пользователь вводит новую высоту в поле ввода), а затем наблюдаемые триггеры "update_dims":

save_height() {
  riot.store.cardHeight = this.refs.input_card_height.value
  riot.store.trigger('update_dims')
}

Внутри моего "карточного" тега riot.store прослушивает update_dims и успешно обновляет {myCardHeight} в интерфейсе.

// function updates the card height
update_cardHeight () {
  this.myCardHeight = riot.store.cardHeight
  this.update()
}
// observable runs when triggered and calls above function 'update_cardHeight'
riot.store.on('update_dims',this.update_cardDimensions)

Однако, если я попытаюсь передать параметры напрямую из riot.store.trigger:

save_height() {
  riot.store.cardHeight = this.refs.input_card_height.value
  riot.store.trigger('update_dims','450')
}

Наблюдаемое ниже не обновляет интерфейс, хотя переменная me.myCardHeight была обновлена ​​с новым параметром высоты:

me = this
riot.store.on('update_dims', function (height) {
  me.myCardHeight = height
  console.log(me.myCardHeight)
  me.update()
})

Как правильно это сделать?

Answer 1

Пока в вашем магазине наблюдаются массовые беспорядки, это должно работать:

riot.store = riot.observable();

var me = this
riot.store.on('update_dims', function (height) {
  me.myCardHeight = height;
  console.log(me.myCardHeight);
  me.update();
});

riot.store.trigger('update_dims', 450);

Если вы очень заинтересованы в сохранении его в объекте, я бы предпочел создать общий магазин со своими собственными свойствами:

var store = {
  observable: riot.observable(),
  height: 25 // default
}

riot.mount('myCard', {store: store})

Тогда внутри тега myCard:

var me = this
me.myCardHeight = opts.store.height;

me.opts.store.on('update_dims', function (height) {
  me.opts.store.height = height;
  me.myCardHeight
  console.log(me.myCardHeight);
  me.update();
});

Теперь, когда вы вызываете это, вы переходите в новую общую высоту:

this.opts.trigger('update_dims', 450);

Кроме того, проверьте RiotControl, который может с этим типом архитектуры.

Надеюсь это поможет!