要求与限制

  1. 转化之后的代码最终跑在小程序引擎上,必须符合小程序的规范,比如最终压缩的代码小于 2M,分包 8M,路由深度不大于5层等

  2. 路由组件必须使用:@areslabs/router,动画组件必须使用:@areslabs/wx-animated

  3. 静态限制 包括入口文件,组件的导入,xxComponent 的识别,需要在使用的时候特别注意

  4. 小程序没有 global 变量,所以在待转化的 React Native 应用中不应该出现对 global 变量的使用,一般情况下当 React Native 运行正常,而小程序控制台出现 xxx is not defined 的时候,需要考虑是否有对 global 的使用,需要特别注意的是代码中对 global 变量的隐式使用,这往往最容易疏忽,比如:

     const a = 1;
     x = 2;
     const b = 3
    

    这里的 x 相当于 global.x

     const a = x = 1
    

    这里相当于 const a = (x = 1) 这里的 x 也是全局属性。

     export default x = 1
    

    下面这个是最容易被滥用的,其实这里 export default 1 就可以了。这个语句相当于 export default (x = 1), x也是全局属性

  5. 一个文件最多只能定义一个组件,无论是 class 组件,还是函数组件

  6. 基本组件的属性展开不被支持,比如 <View {...x}/> 。但是自定义组件是支持的,比如A是一个自定义组件,那么可以 <A {...x}/>

  7. ref 必须是方法,不支持字符串

  8. 不支持 onLayout 方法

  9. 在 React Native 里面,使用 map 方法返回组件数组是很常见的操作, 比如:

     <A>
         {
             arr.map(ele => <Text key={ele}>{ele}</Text>)
         }
     </A>
    

    在 React Native 中,如果没有指定唯一`key,将会报警告。但是转化引擎要求这里的 key 必须明确指定。

    同样 FlatList, SectionList 的 key/keyExtractor 也是必须指定的。

  10. 属性传递JSX&组件 详见

  11. 禁止在非组件文件处理JSX片段 详见

  12. 函数式组件需要在定义时导出 详见

  13. 谨慎使用高阶组件 详见

results matching ""

    No results matching ""