中国新媒体网新浪微博官方微博 中国新媒体网新闻投稿新闻投稿 中国新媒体网RSS订阅RSS订阅

中国新媒体网免费投稿功能
中国新媒体网 当前位置:主页 > mi >

探秘 vue-rx 2.0

www.cnnmp.net 时间:2017-01-22 06:01 来源: 中国新媒体网 阅读:我要投稿  
  未知_未知十年品牌【真人娱乐】 中国一点都不能少未知 

(点击上方公众号,可快速关注)

  作者:徐飞(@民工精髓V)

  链接:github.com/xufei/blog/issues/39

  前一段时间,我写了两篇文章,一篇是对目前前端主流视图框架的思考,一篇是深入使用RxJS控制复杂业务逻辑的,在这两篇中,我分别提到:

  • 期望在复杂业务逻辑方面使用RxJS,更好地进行抽象,但是视图上使用轻量MVVM以达到快速开发的目的。

  • 目前VueJS中,如果要结合RxJS,可能需要手动订阅和取消订阅,写起来还是没有CycleJS方便。

  最近,VueJS社区升级了vue-rx这个库,实现了比较方便地把VueJS和RxJS结合的能力。

  我们来详细了解一下。

  在视图上绑定Observable

  VueJS本身不是基于RxJS这一套理念构建的,如果不借助任何辅助的东西,可能我们会需要干这么一些事情:

  • 手动订阅某些Observable,在observer里面,把数据设置到Vue的data上

  • 在视图销毁的时候,手动取消订阅

  在业务开发中,我们最常用的是绑定简单的Observable,在vue-rx中,这个需求被很轻松地满足了。

  与早期版本不同,vue-rx 2.0在Vue实例上添加了一个subions属性,里面放置各种待绑定的Observable,用的时候类似data。

  比如,我们可以这么用它:

  rx-simple.vue

  <template>

  <div>

  <h4>SingleValue</h4>

  <div>{{single$}}</div>

  <h4>Array</h4>

  <ul>

  <liv-for="item of arr0$">{{item}}</li>

  </ul>

  <ul>

  <liv-for="item of arr1$">{{item}}</li>

相关文章:

中国新媒体网

关于我们 |联系我们 |广告服务 | 免责声明 | 隐私保护 |本站地图 |友情链接

Copyright ? 2010-2012 CNNMP.NET

本网站法律顾问:北京市中润律师事务所