![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
ReactNative
石博
刚刚好
展开
-
ReactNative-获取android手机Mac地址(0.45版本)
首先:RN与android端通信,使用RCTDeviceEventEmitter,RN先获取android6.0权限,然后给android发送请求获取Mac,android端收到后返回Mac给rn。步骤如下:可参照rn官网对于ToastAndroid的方式:http://facebook.github.io/react-native/docs/native-modules-android.html...原创 2018-05-18 09:30:39 · 1520 阅读 · 0 评论 -
关于let{a}=B出现的解构赋值
如题,他的意思其实是let a=B.a;这种写法叫解构赋值,详细可看下面博客如下:https://blog.csdn.net/m0_37263637/article/details/79964874简单的使用场景和例子://解构赋值 //1,对象 let user={ a:2, b:3,...原创 2019-01-09 15:35:28 · 8279 阅读 · 0 评论 -
ReactNative使用Redux例子
中文文档地址:https://www.redux.org.cn/导包:npm install redux-thunk//这个是用来支持发送异步的action,常见如网络请求:请求前触发请求中的action,等请求拿到回调再去触发请求成功和失败的actionnpm install --save react-reduxnpm install --save redux一:三个主...原创 2019-01-11 11:30:21 · 1690 阅读 · 0 评论 -
React-native:FlatList基本使用
<FlatList style={{width: ScreenWidth}} ListFooterComponent={ //在底部的view,对应有ListHeaderComponent //在列表顶部和尾部需要显示额...原创 2019-02-21 14:01:45 · 3038 阅读 · 0 评论 -
ReactNative控制只刷新页面的一部分
shouldComponentUpdate(nextProps, nextState) 该方法控制页面是否需要刷新,true表示刷新false表示不刷新。解决办法就是:如页面包含多个控件,把控件都封装起来,在封装的控件的shouldComponentUpdate里面判断props是否和之前一致,一致就不刷新。...原创 2019-02-27 15:44:47 · 1123 阅读 · 0 评论 -
ReactNative使用FlatList实现上拉加载
源代码:https://github.com/15539158137/GDMapDemo关键点:onEndReachedThreshold:0-1,表示当前列表滚动到距离列表尾部还有 当前列表可见长度*这个值 的时候触发下面的onEndReached方法。onEndReached:跟上面参数相对应。用来做加载的触发事件。只讨论加载不讨论刷新(demo同)上拉的三个state...原创 2019-03-01 15:47:54 · 1607 阅读 · 0 评论 -
React-native封装view
const Dimensions = require('Dimensions'); //必须要写这一行,否则报错,无法找到这个变量const ScreenWidth = Dimensions.get('window').width;const ScreenHeight = Dimensions.get('window').height;export default class ShowIt...原创 2019-02-21 10:18:22 · 360 阅读 · 0 评论 -
React-native Alert弹出多个按钮
最多3个,使用如下 Alert.alert('提示', '是否登录?', [{ text: '确定', onPress: () => { this.props.status == "在线" ? login_out() : this.login() ...原创 2019-02-21 13:13:54 · 796 阅读 · 0 评论 -
Promise的基本使用
new Promise((resolve, reject) => { this.timer = setTimeout(() => { resolve(); }, 500) }).then(() => { ...原创 2019-01-11 10:18:59 · 265 阅读 · 0 评论 -
Realm-ReactNative使用
最大的点:Realm中有主键的概念,主键不能重复,但是主键不能自增,这个自增需要自己来保证1.导入跟着官方走2.使用注:由于所有页面的增删改查都依靠一个realm对象,所以吧这个对象保存在单例的一个属性中,保证全局唯一let instance = null;export default class SaveUtil { realm; constructor...原创 2018-12-11 16:01:10 · 1579 阅读 · 0 评论 -
React Native常用属性
1.flex属性//flexDirection表示排布的方向,类似android线性布局的排布方向:横线和竖向,默认是竖向'column',横向'row'//justifyContent:表示布局内实际内容的显示区域(以横向的row举例):整体居左、居右、居中、还是两端贴边中间控件间距相等('space-between'),还是单个控件的左右间距都相等('space-around')//...原创 2018-05-18 16:03:46 · 1058 阅读 · 0 评论 -
ReactNative中导航:TabNavigator和StackNavigator
首先导入:yarn add react-navigation2019.02.28新增:https://reactnavigation.org/docs/en/getting-started.html#installation这个是2.3.0版本的api,新版本使用方法查看上面地址"react-navigation": "^2.3.0"StackNavigator:im...原创 2018-05-21 12:25:49 · 1796 阅读 · 0 评论 -
react-navigation实现正向和反向传值
首先:怎么实现跳转,看下面的https://blog.csdn.net/shb2058/article/details/803904681.正向传值以及配置callback//跳转到下一个页面 toGongDanDetail(data) { this.props.navigation.navigate('GongDanDetailPage', { d...原创 2018-05-24 11:29:40 · 3294 阅读 · 0 评论 -
react native proptypes报错
主要因为proptypes已经从react里面移除需要单独导入npm install --save prop-types使用:import PropTypes from 'prop-types';转载 2018-06-05 09:04:53 · 739 阅读 · 0 评论 -
ReactNativ使用二维码
1.跟着走https://www.jianshu.com/p/8bef243bc35d导入smart-barcode会报错(1)android下buildversion改25.0.0(2)android下RTCCapturePackage去掉方法createJSMoudle (3) PropTypes报错:https://blog.csdn.net/shb2058/article/details...原创 2018-06-12 13:15:34 · 261 阅读 · 0 评论 -
导入realm数据报错:Tried to download(404): https://static.realm.io/node-pre-gyp/2.7.1/realm-v2.7.1-node-v64
https://github.com/realm/realm-js/issues/674这个版本有问题,使用这个版本Install the older version in the project foldernpm install --save realm@0.14.3Open node_modules/realm/package.json and remove this line:"postl...原创 2018-06-01 09:59:48 · 1693 阅读 · 0 评论 -
JS获取当前时间若干小时后的时间
let timestamp = new Date().getTime();//当前的时间戳 timestamp = timestamp + 12 * 60 * 60 * 1000; //格式化时间获取年月日 var dateAfter = new Date(timestamp); this.setState((prevState) ...原创 2018-08-31 11:21:02 · 10521 阅读 · 1 评论 -
reactNative常用第三方库
0.数据存储https://github.com/sunnylqm/react-native-storage1.图片多选、裁剪https://github.com/ivpusic/react-native-image-crop-picker注意:如果你不是用cocoapad导入的,可以打包,但是导出会报错:Failed to verify bitcode in......需要在...原创 2018-10-11 15:20:50 · 293 阅读 · 0 评论 -
reactnative使用alert实现modal
modal在android上使用没有任何异常,在ios上会出现卡死、中断操作等。使用alert来实现选择器或者弹出框: Alert.alert('请选择', '拍照方式', [{ text: '相机', onPress: () => { this.getPhotoFromCameraOGallary(true)...原创 2018-10-10 15:45:39 · 920 阅读 · 0 评论 -
React-native ":CFBundleIdentifier", Does Not Exist
使用react-native upgrade原创 2018-12-13 12:58:00 · 317 阅读 · 0 评论 -
fetch设置网络超时时间
let promise = new Promise((resolve, reject) => { this.timer = setTimeout(() => { reject(new Error('超时了')); }, 20000); }).then((data) => { ...原创 2019-03-06 16:26:09 · 1997 阅读 · 0 评论