obserable的使用

2019独角兽企业重金招聘Python工程师标准>>>

在开发rgrid（目前是放在 uliweb-ui 项目里了，还没有放到rgrid项目中）时遇到一个问题，外层有自动生成的按钮，有些按钮是希望和表格行的选中自动联动，比如存在选中行时按钮显示为可用，无选中行时，按钮显示为禁用的状态。表格是使用rtable生成的，它相当于是rgrid的子元素。这样我就需要在父元素上感知子元素状态的变化。原本是想通过回调函数，在rtable中定义有关select和deselect的事件回调，但是这样一来，在rgrid中进行了处理，就无法让外部调用时使用这一事件回调了，因为已经绑定了处理函数。因此想使用事件来处理。正好riot本身提供了ovserable的机制，详情可以参考 这里 。那么具体怎么用呢？

首先在rtable中定义一个对象，如：

this.observable = opts.observable

这样，允许从rtable外部传入一个ovservable的对象。然后在select和deselect需要向外通知状态的地方添加：

this.observable.trigger('selected', row)

这样发出事件的代码就处理好了。

然后在是rgrid中，先生成一个observable的对象：

this.observable = riot.observable()

然后使用它来绑定事件：

this.observable.on('selected deselected', function(row) {
  self.update()
})

可以同时绑定多个事件。

同时在生成子元素的地方将observable对象传递给rtable:

<rtable cols={cols} options={rtable_options} data={data} start={start} observable={observable}></rtable>

转载于:https://my.oschina.net/limodou/blog/739081