flutter-hooks

frhooks。一个让你可以在 flutter 写 hooks 的库。甚至尽量和 react hooks 保持了一样的 api 和 使用方法。

为什么要用 hooks

本地状态的管理方式 State,有点啰嗦和繁琐。无法复用逻辑(需要反复订阅副作用,手动取消副作用)。UI 和 逻辑无法分离。flutter 也需要这样一个能复用逻辑,分离逻辑的方案。对从 React 转过来的我来说 hooks 再合适不过了。

用法

和 react-hooks 的用法几乎相同。

useContext

class MyWidget extends HookWidget {
  Widget build() {
    BuildContext context = useContext() 
    return Container()
  }
}

useState

Dart 没有类似 Javascript 的结构。所以 useState 的返回值被我设计成了 StateContainer。

class MyWidget extends HookWidget {
  Widget build() {
    StateContainer result = useState(0)
    // result.state     // result.setState     return Container()
  }
}

useEffect

class MyWidget extends HookWidget {
  Widget build() {
    useEffect(() {
      // do effect here.       return () {
        // remove effect here       }
    })
    return Container()
  }
}

useCallback

class MyWidget extends HookWidget {
  Widget build() {
    var callback = useCallback(() {
      return 1
    })
    // result == 1     var result = callback()
    return Container()
  }
}

以上4个 hook 足以满足你在 flutter 中设计自己的状态管理方案了。

Why not flutter_hooks

在我发布 frhooks 的时候有段插曲…

flutter_hooks 的作者问我为什么不用他的,而要另外搞一套。

我一开始在 Ractor.dart 里面为了实现 useStore,写了个简易版的 useState 和 useEffect。正如网上介绍 hooks 的文章。我使用 index 和数组 实现的。代码非常难看。

而后我空下来了打算重构 hooks 部分,把它重构成独立的包。我开始翻看 react hooks 的源码,按照调用顺序和 linked list 重构了 hooks。

那么我为什么不用 flutter_hooks?

第一个原因估计是内部实现不优雅,内部实现里还有 State,而且是按照 index 实现的。

第二个原因就是 useState 的返回值没有 setState,我需要这个函数。

第三个原因估计是我想造轮子而已:joy:

最后

欢迎尝试 frhooks。欢迎各种形式的 pr 和 issue。

huangbinjie/frhooksgithub.com《flutter-hooks》

    原文作者:corol
    原文地址: https://zhuanlan.zhihu.com/p/58175634
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞