JS checklist

升级方法

转换工具不是万能的，提交代码前请谨慎 diff。转化工具做不到的，请查看下面的升级点中的红字部分。

  1. 安装最新版 qrn-cli
  2. 在项目目录下执行 qrn shift，会自动转换
    • qrn shift -d：预转换（不修改源文件，只输出错误和提示）
    • qrn shift -t [路径]：转换指定路径的文件（默认是当前文件夹）

请尽量选用高版本的 node (6 及以上)来执行 shift，这样能避免因不支持的 js 语法而出现的转化错误。

输出结果分析：

Results：

  • errors：文件解析错误（比如：语法错误，无法解析的 flow 语法等）
  • unmodified：未修改的文件
  • skipped：跳过的文件
  • ok：修改的文件

所有红色提示的错误或提示都是需要 check 的点，包括：

官方移除的依赖包

新版的 React Native 删除了 isemail、joi、moment、readline2 和 topo 这些依赖，当你的项目里引入的这些依赖时会提示

X `moment` 包在官方的依赖中移除了，请使用 `npm i -S moment` 安装。

此时需检查之前是否单独安装了该包，若没有，需手动安装。

自定义导航栏

自定义导航栏中的 title、leftButtonText 和 leftButtonPressEvent、rightButtonText 和 rightButtonPressEvent 字段中，删除了传入函数时的第一个参数 route。

// 已删除 route
rightButtonText(route, store){
	return (
	  <Text>v2.0</Text>
	);
}

// QRN 3.0 版本
rightButtonText(store){
	return (
	  <Text>v3.0</Text>
	);
}

如果项目启动后仍旧报如图所示错误，请检查你所引用的外部 npm 模块是否有依赖问题。

详细的升级点请参照下面的说明。

Ext 升级点

Ext-Router

1. 页面跳转的功能全部交由 Native 端实现。

Native 实现的新版路由返回值是一个 pending 状态的 Promise 对象。接口功能正常时状态变成 resolved，返回 true；接口出错时状态变成 rejected，返回 false。

// Promise 方式
onPress() {
    Ext.open(A).then(
        (res) => console.log(res), // true
        (res) => console.log(res), // false
    );
}

另外，我们也支持 async/await 的处理方式。

// async/await 方式
async onPress() {
    const res = await Ext.open(A);
    console.log(res); // 成功时 true，失败时 false
}

2. 废弃了通过 Ext.defaults.appName 配置应用名的方式。

3. 删除了导航栏自定义内容和点击事件时传入的函数的 route 参数。

4. 在调用 sendScheme 接口发送 biz 形 scheme 时，若其中 ext 参数为 false，则在接收页面的 receiveScheme 监听中，必须调用 Ext.Router.Bridge.sendNativeEvents 方法，否则将导致 sendScheme 的 callback 无法接收到回传数据，且会生成一个透明层导致当前页面无法点击！

base 页面:

console.warn('ext=false的情况下不会自动打开scheme,而是会将控制权交给用户,可以通过监听RCTDeviceEventEmitter的sendScheme事件来自行接收/处理收到的scheme');
Ext.Router.Bridge.sendScheme({
    url: schemeProtocol+'://react/biz?hybridId='+Ext.defaults.hybridId+'&pageName=pageA&ext=false',
    }, (data) => {
        console.log('~~~~~~~ sendSchema biz', data);
});

pageA 页面:

DeviceEventEmitter.addListener('receiveScheme',(res)=> {

  // do something...

  Ext.Router.Bridge.sendNativeEvents({
    id: res.callbackId,
      data:{
            aa:111,
          },
      });
  });
5. 删除了 Ext.Router.Bridge.backToReactVC() 方法。

Ext-Webx

  1. 删除 view 的 onPress 属性支持。
  2. 删除 组件方法自动 .bind(this) 的特性。

其它

1. 针对 QRN 中的 scheme 格式做了如下处理：废弃了 scheme 格式中的 moduleName 和 qInitView 字段，采用新的 pageName 参数来替换。详情可参考 新版 scheme 方式的处理

QRN 3.0 版本兼容了 2.x 版本已有的 scheme 处理方式，但我们还是建议你修改成新版 scheme 的处理方式。

2. @providesModule 注释格式和位置

qrn-cli 会进行部分转换，需要手动处理已经删除的组件的使用，且需要将包含 `@providesModule` 的注释块放在当前文件的最顶部

文件中通过在注释中以 @providesModule 声明指定模块的方式的下一行不能再有非 @ 符号开始的注释，且包含 @providesModule 的注释块必须放在当前文件的最顶部。

3. EXT 中去掉了全局变量 React

如果报找不到 React 的错误，请检查是否引用了正确的 React。

QRN-EXT 中去掉了 指向 ReactNative 的全局变量 React，所有用到 React/RN/QRN 的地方，都需要自己引用。

4. 升级 QRN 外部UI组件依赖为 ^3.0.0

QRN 外部UI组件指的是 @qnpm/react-native-ui-xxx 一类的模块, 如果引用了这类模块，需要全部升级依赖为 ^3.0.0

可以参照下面修改package.json：

{
    "dependencies": {
      "@qnpm/react-native-ui-carousel": "^3.0.0",
      "@qnpm/react-native-ui-dialog": "^3.0.0",
    ...
  }
}
v3.0.0
v3.0.0-iOS