AppRegistry
AppRegistry是JS运行所有React Native应用的入口。
最常用的是:注册根组件registerComponent(appKey, getComponentFunc)
AppRegistry.registerComponent('Test', () => SampleComponent);
AsyncStorage
异步存储读取
(第三方的)react-native-storage
AlertIOS
-
static alert(title, message?, callbackOrButtons?)
- callbackOrButtons:一个函数func
(()=> void)
或者button数组ButtonsArray
- 默认情况下,
Cancel
和OK
, func是点OK的方法 - ButtonsArray: 对象数组,有以下几个参数
- text:
- onPress:
- style: AlertButtonStyle
- default
- cancel
- destructive
this.customButtons = [{ text: 'Custom OK', onPress: this.saveResponse(按钮方法) }, { text: 'Custom cancel', style: 'cancel',(default/cancel/destructive) } ];
- callbackOrButtons:一个函数func
-
static prompt(title, message?, callbackOrButtons?, type?, defaultValue?)
有输入框的提示,可以用于提示用户名/密码输入- type: AlertType
- default
- plain-text
- secure-text
- login-password
AlertIOS.prompt( 'input your password', null, this.customButtons, 'login-password', 'userName')
ActionSheetIOS
-
static showActionSheetWithOptions(options, callback)
-
options
字符串数组,button title cancelButtonIndex
destructiveButtonIndex
title
message
tintColor
-
callBack
回调func,
showActionSheet = ()=> { ActionSheetIOS.showActionSheetWithOptions({ options: BUTTONS, cancelButtonIndex: CANCEL_INDEX, destructiveButtonIndex: DESTRUCTIVE_INDEX, tintColor: 'green', title: 'action sheet title', message: 'message' }, (buttonIndex) => { this.setState({clicked: BUTTONS[buttonIndex]}); }); };
-
-
static showShareActionSheetWithOptions(options, failureCallback, successCallback)
分享弹出框url
message
-
subject
主题 -
excludedActivityTypes
弹出框中不显示的活动
showShareActionSheet = ()=> { UIManager.takeSnapshot('window').then((uri)=> { ActionSheetIOS.showShareActionSheetWithOptions({ url: uri, message: 'message to go with shared url', subject: 'a subject to go in the email heading', excludedActivityTypes: [ 'com.baidu.www' ] }, (error) => alert(error), (success, method) => { var text; if (success) { text = 'Shared via ${method}'; } else { text = 'You didn\'t share'; } this.setState({text}); }); }).catch((error) => alert(error)); }
PixelRatio
相当于iOS中的
[UIScreen mainScreen].scale
-
static get()
- PixelRatio.get() === 1
- mdpi Android devices (160 dpi)
- PixelRatio.get() === 1.5
- hdpi Android devices (240 dpi)
- PixelRatio.get() === 2
- iPhone 4, 4S
- iPhone 5, 5c, 5s
- iPhone 6
- xhdpi Android devices (320 dpi)
- PixelRatio.get() === 3
- iPhone 6 plus
- xxhdpi Android devices (480 dpi)
- PixelRatio.get() === 3.5
- Nexus 6
- PixelRatio.get() === 1
-
static getPixelSizeForLayoutSize(layoutSize)
将布局尺寸,转化为像素尺寸。返回的是整数数值var image = getImage({ width: PixelRatio.getPixelSizeForLayoutSize(200), height: PixelRatio.getPixelSizeForLayoutSize(100), });
AppState
常用于推送通知
-
currentState
当前状态 -
addEventListener(type, handler)
添加事件监听 -
removeEventListener(type, handler)
移除事件监听
NetInfo
获取网络状态和类型,用时再查找
CameralRoll
提供相册相关的功能
-
static saveToCameraRoll(tag, type?)
存储图片- type: 只能是
photo
或者video
- ? 图片保存成功之后的回调
CameraRoll.saveToCameraRoll(imgURL + img2, 'photo', (url)=>{ photos.unshift(url); _that.setState({ photos: photos }); AlertIOS.alert('图片保存成功'); }, ()=> { AlertIOS.alert('图片保存失败'); });
- type: 只能是
-
static getPhotos(params)
获取图片- params 具体这里
var fetchParams ={ first: 4, groupTypes: 'All', assetType: 'Photos', }; var imgURL = 'http://vczero.github.io/lvtu/img/'; componentDidMount() { var _that = this; CameraRoll.getPhotos(fetchParams) .then((data)=> { console.log('====' + data.edges); var edges = data.edges; var photos = []; for (var i in edges){ photos.push(edges[i].node.image.uri); } _that.setState({ photos: photos }); }, ()=> { alert('图片获取失败'); }); }
-
第三方库 react-native-camera
Vibration
控制设备震动
Geolocation
处理位置信息
- iOS
- plist 添加
NSLocationWhenInUseUsageDescription
字段 - 使用
react-native init
创建的项目,默认开启定位功能
- plist 添加
-
Android
- AndroidManifest.xml 添加
- AndroidManifest.xml 添加
-
static getCurrentPosition(geo_success, geo_error?, geo_options?)
获取当前位置信息- geo_options
-
enableHighAccuracy
: bool, 是否高精度 -
timeout
超时时间 -
maximumAge
多久之后再次获取,即重复获取时间间隔
-
- geo_options
-
static watchPosition(success, error?, options?)
监听位置变换信息 static clearWatch(watchID)
static stopObserving()
componentDidMount() {
navigator.geolocation.getCurrentPosition(
(position) => {
var initialPosition = JSON.stringify(position);
this.setState({initialPosition});
},
(error) => alert(JSON.stringify(error)),
{enableHighAccuracy: true, timeout: 20000, maximumAge: 1000}
);
this.watchID = navigator.geolocation.watchPosition((position) => {
var lastPosition = JSON.stringify(position);
this.setState({lastPosition});
});
}
数据请求
fetch
封装程度更好
_postRequest(url, data, callback) {
var opt = {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify(data)
};
fetch(url, opt)
.then((response) => response.json())
.then((responseJson)=>{
console.log(responseJson);
callback(responseJson);
})
.catch((error)=>{
console.warn(error);
});
}