b269b3750a72b3ccc732f23991135e8f.png

Remax 是一个全新的使用 React 开发小程序的框架,了解 Remax 可以参考《Remax - 使用真正的 React 构建小程序》。

这次版本主要有三个方面的改进。

在同一个 React 实例里渲染页面

这个改动是什么意思呢?

在 1.0 版本中,每个页面都是一个单独的 React 实例,这相当于一个多页面应用,每个页面里都调用一次 render(<Page />, container),每个页面的状态都是隔离的。这样导致的问题就是多个页面之间没法通过 React 的 Context 来共享状态。

而在 1.1.0 中,我们通过在 App 中创建一个 React 实例,然后使用 createPortal 再把每个页面渲染到自己的 Page 实例上。这样我们就把所有页面统一到了一个 React 实例里。这样做的好处就是 App 变成了整个应用的总入口,我们可以在上面使用 Context 来方便得在多页面之间共享状态。更加可以低成本的去接入 Redux 这种需要一个全局 Provider 的库。

下面分别是使用 Context、Redux、Dva 的三个例子:

  • Context - https://github.com/remaxjs/todo-demo/tree/master/alipay/src
  • Redux - https://github.com/remaxjs/todo-demo/tree/master/alipay-redux/src
  • Dva - https://github.com/remaxjs/todo-demo/tree/master/alipay-dva/src

有兴趣了解关于这个改动的具体实现可以参考 !189。

完善 TypeScript 类型定义

现在,所有的原生组件和小程序 API 都加上了类型定义,为你的小程序保驾护航。

支持头条小程序

可以使用下面的命令快速开启头条小程序的开发:

$ npx degit remaxjs/template-toutiao my-app
$ cd my-app
$ npm run dev

使用头条小程序开发者工具打开项目下的 dist 目录。

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐