美文网首页Flutter
最简单rxdart,bloc

最简单rxdart,bloc

作者: aibinMr | 来源:发表于2019-04-11 12:03 被阅读114次

这是一篇个人理解的文章,如果存在错误请大家指正,本篇幅不介绍原理 只介绍过程(用一位博客朋友的代码做示例)

1 rxdart和bloc要解决的问题是什么(现在我都不明白bloc是什么)

rxdart和bloc用来处理跳转页互传数据,数据透传

2 如何透传

很多网络文章介绍了很多概念,概念原理太枯燥了,说白了,透传的数据是通过BuildContext透传过去的,把数据绑定在BuildContext上面,子组件会继承BuildContext,那么子组件会得到绑定数据,目标页通过上层页面跳转的时候把BuildContext带入 那么目标页也自然会有上一页的BuildContext,自然会有绑定的数据

3 如何实现

class BlocProvider extends InheritedWidget{

        final CountBLoC bLoC=CountBLoC();

        BlocProvider({Keykey,Widget child}):super(key:key, child:child);

        @override

        boolupdateShouldNotify(_)=>true;

        static CountBLoC of(BuildContext context)=>

        (context.inheritFromWidgetOfExactType(BlocProvider) as BlocProvider).bLoC;

}

这页就是A页具体实现的过程 bloc 就是我们保持数据,处理数据的对象,child就是具体的ui组件,由于ui组件默认会继承父组件的BuildContext,所以子组件也和bloc实现了绑定,二子组件在跳转的时候使用的是这串语句

Navigator.of(context).push(MaterialPageRoute(builder: (context) => UnderPage())))

完整代码

好,我不管这串语句具体是什么意思,但是我看到有context做参数传递,那我就明白了,这个时候带有bloc 的context已经被传递到第二个页面,那现在的问题是如何在组件中获取bloc,

那么如何在子页获取bloc呢

final bloc = BlocProvider.of(context);

获取bloc监听,或者获取句柄

stream: bloc.stream,

监听结果,获取监听结果句柄

AsyncSnapshot<int> snapshot

使用就不过多介绍了

${snapshot.data}

这其中少了如何对数据进行逻辑处理,那就先把bLoC代码贴出来

其实在获取bloc后,直接执行即可

bloc.increment(),

而bloc.increment(),就是一段业务处理过程,这篇文章还有两个需要注意的,1是BlocProvider父组件使用的是InheritedWidget,第二个就是bloc中的dispose方法,这个可能在做资源回收,我是不太想深究了,

好,这篇文章就到这里,这篇文章并不是讲redart和bloc的具体原理和概念,就是讲了一下我自己理解的数据传递过程,新手可能会问rxdart在哪,BehaviorSubject这个类就是rxdart具体的封装吧,就在Bloc代码中。想在想rxdart是什么我觉得就是一个可控的双向绑定,

这个是我复制到自己github下的地址,这个地址不在更新

我clone代码的原地址github原地址,为大家能找到代码提供者最新代码使用

相关文章

网友评论

    本文标题:最简单rxdart,bloc

    本文链接:https://www.haomeiwen.com/subject/pvaoiqtx.html