一,样式相关
1,避免使用组合选择器
组合选择器在rn中不受支持、在各大小程序中的支持情况程度不同,在使用插槽的机制的微信小程序不支持
2,基本和 rn 一致,原因是rn布局引擎yoga的限制。
在所有端的样式中,h5的兼容性最好,小程序的次之,最差的就是RN了。统一多端即是对齐短板也就是要以RN的约束来管理样式,同时兼顾小程序的限制
二,部分原理差异
1,setState 一定是异步的。官方文档,https://taro-docs.jd.com/taro/docs/state
2,事件绑定传参。与 react 不同的是,这里使用 bind 比 箭头函数 性能好。https://taro-docs.jd.com/taro/docs/event
3,ref 拿到的感觉并不是组件实例,而是一堆属性的组合。
4, this.props.children 无法操作,无法解构。
三,条件编译
1,按文件名进行条件编译
假设目录中存在这些文件
|- Input.tsx
|- Input.alipay.tsx
|- Input.h5.tsx
在引入 Picker 组件时
import Input from ‘./Input’;
会自动引入特定平台的组件。比如,在支付宝小程序编译时,会引入Input.alpay.tsx 文件,在h5项目会引入Input.h5.tsx.
同样样式文件同样适用于这条规则。
2,按指令进行条件编译
用来标记当前编译的平台类型,跟 process.env.TARO_ENV
取值相同;
制定平台剔除
/* #ifndef %PLATFORM% */
//样式代码
/* #endif *
指定平台保留
/* #ifdef %PLATFORM% */
// 样式代码
/* #endif */
珍爱生命 远离编程