Question

我的Riot.js可观察性如下：

在我的＆＃39; global-header＆＃39;在暴乱的全局范围内标记riot.store observable得到更新（用户在输入字段中输入新的高度），然后是可观察的触发器＆quot; update_dims＆＃39;：

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

在我的卡内＃39;标记riot.store监听＆update;目标＆＃39;并成功更新界面中的{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')
}

即使使用新的height参数更新了me.myCardHeight变量，下面的observable也不会更新界面：

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。

希望这有帮助！

无法让Riot.js观察到通过回调传递params

1 个答案: