应用
1 安卓打包
2 调试
3 微信分享和登录
使用 react-native-wechat 地址
设计图来自蓝狐,可以根据里面的尺寸来进行开发,但是左右的间隔需要通过获取设备宽度减两边来得出,
苹果手机用 爱疯6, 安卓需用自定义尺寸。
在苹果上,默认高度是整个手机的高度;然而安卓默认是除了状态栏以下的高度,我们通过Dimensions获取的高度也是不一样的,也就是说,在安卓手机上获取得到的高度也是除了状态栏以下的高度;官方提供一个常量,可以获取安卓手机上状态栏的高,在苹果手机上使用此方法获取得到的是undefined:
currentHeight(仅限Android)状态栏的当前高度StatusBar.currentHeight
弹性布局中,给子text设置 width 不靠谱,在ios正常,在安卓不生效,但是给text套一个View 在view上设置宽度就可以定宽了
rightStyle: {
flex: 1,
flexDirection: 'row',
justifyContent: 'flex-end',
alignItems: 'center',
},
<View style={styles.rightStyle}>
<View style={{ width: 200 }}>
<Text style={styles.rightText}>{extra || rightText}</Text>
</View>
{arrow && <Image style={{ marginLeft: 8 }} source={rightPng} />}
</View>
TextInput 中的value 必须要为 string 不然回填不上, number 都填不上
<TextInput
value={String(inputValue || '')}
// style={{ textAlign: 'right', width: 200 }}
onChangeText={inputChange}
keyboardType={keyboardType}
placeholder={inputPlaceholder}
/>
以为text的换行省略号不行,原来是自己把text封装了一下,忘记把props传进去了,。。。自己坑自己
键盘遮挡问题的解决 断网后的页面刷新保存问题 右上角 弹框实现和封装
常见错误
1打包时报错
Could not list contents of '/Development/personalProject/RNCommunity/node_modules/node-pre-gyp/node_modules/.bin/needle'. Couldn't follow symbolic link.
2. 书写时
Error while updating property 'padding' in shadow node of type: RCTView
null
For input string: "4% 1% 2"
键盘遮挡
选择日期控件更换,点击选择默认为当前日期
上传文件,照片墙
图表展示
联网方式不对,app闪退
web富文本编辑,在app端展示
长按 tooltip 的实现 复制和删除
分页和刷新组件的封装
上部分内容,下部分列表的实现:上部分内容放在 flatlist 的header里面, 这样就可以用封装的通用list组件了
echart图表在rn中的展示
基础工具util的封装
日期格式转换
request请求封装 + 错误提示的统一封装
遇到的坑
也有一次一块传多个大文件时,经过多人排查,才发现,原来是 nginx限制了请求体的大小