现在我们有一个基础的例子已经启动在运行中,还可以在上面做一些复杂的事情,例如fetch操作。我们可以创建一个简单列表,可以从其他资源地方fetch获取数据,一旦state发生变化后,重新渲染结果。为了完成此任务,同时为了更好的体验将传递一个loading信息给用户。 上面这个需求,我们需要单独的处理Action和Channel,同时也需要在一个干净的、良好组织下的代码下处理其一些额外的情况。 Building the App… 实际上我们需要定义一个函数来处理fetch操作和通知loading什么时候开启和结束。
编写一个创建Channel的函数。
现在已经有createChannel了,我们还需定义一组Action。
接下来我们写App的Component部分,这里没什么特殊的,仅仅就是一个list和两个button和一个input,第一个button用于获取列表数据,另外一个用于添加文本到input里。
现在已经基本上写好了,类似于我们之前这样,创建一个AppStart函数,同时它还希望有一个component和一个类型store。store就是一个用于存放getter和setter的简单对象。
现在我们需要做的是为之前定义的Actions创建我们的Channels。
我们在return中获得一个isLoading,一个items和一个addItem的channel,现在我们可以通过channel来更新我们的状态,还有需要注意的是,AppChannel被称为一个只处理最新值的滑动缓冲。
最后我们只需要调用AppStart就好了。
以上只是一个快速的案例来解释React怎么结合Channel一起使用,我们需要更多的时间来思考和验证这种方案怎么弄才对于我们有什么好处。 通过之前那节中的listen函数,我们怎么将一个元素转换成一个Channel,从而抛砖引玉,引出其他的想法,包括对window的反应,改变你的App的结构,样式或布局。 以上提供的例子可以看成一个使用该新特性可能性的新起点。 总结 这是一篇介绍Generator和Channel的文章,我们任然缺少一些重要的部分,比如Transducer,接下来的文章将会覆盖Channels和Transducer,包括更多使用React的例子。 更新 目前已经发布introduction into Channels and Transducers in Java。 参考链接 ES6 Generators in depth ES6 Generators Deliver Go Style Concurrency Callbacks vs. Coroutines js-csp Taming the Asynchronous Beast with CSP in Java Why coroutines won't work on the web No promises: asynchronous Java with only generators CSP and transducers in Java GitHub - clojure/core.async: Facilities for async programming and communication in Clojure Communicating Sequential Processes CSP is Responsive Design A Study on Solving Callbacks with Java Generators 最后他曾经分享过的文章: 他的知乎专栏:https://zhuanlan.zhihu.com/tw1993 (责任编辑:本港台直播) |