深入浅出setState

199 阅读2分钟

在Flutter中,我们使用setState方法来刷新,那么到底它是如何实现刷新的,底层的原理又是什么,下面给大家抛砖引玉,如有异议欢迎留言指出,大神勿喷,鄙人乃小菜一枚。 首先我们来看一下setState方法的源码: 可以看出setState方法其实是调用了markNeedsBuild()方法,而markNeedsBuild()方法内部会标记element为dirty,然后在下一帧会重新绘制,所以setState并不是立刻生效的。

那么setState究竟是怎么实现刷新的呢?我们知道其实每个widget就代表一帧,在widget创建时会创建element实例,而state实例是在statefulElement创建时被创建的。当回调setState方法时,其实分为2种情况。

第一种是该节点更新前的child为null,也就是oldWidget为null,更新后newWidget也有2种情况,首先如果newWidget也为null,那么child始终是null,直接返回null即可,其次如果newWidget不为null,说明这个节点新增了子节点,那么会生成一个新的widget返回。

第二种是该节点更新前的child不为null,也就是oldWidget不为null,更新后newWidget也有2种情况,首先如果newWidget为null,说明要移除掉oldWidget,则会调用deactivateChild(child)方法移除并且返回null,其次如果newWidget不为null,则先会调用canUpdate方法判断是否能更新,这个方法会对比oldWidget和newWidget的runtimeType和key,如果runtimeType相同(表示Widget类型相同)和key相同或者未设置key,该方法返回true,说明widget并未改变,只需要更新widget的配置数据并rebuild即可,反之该方法返回false,说明widget发生了改变,则会调用deactivateChild(child)方法移除掉odlWidget,然后创建newWidget返回。

以上就是setSate方法实现刷新的底层原理,感谢支持~~欢迎纠正~~

参考文章