1. react-native-swiper 轮播组件
参考
//www.greatytc.com/p/4dba338ef37a
render() {
if(this.state.swiperShow){
return(
<View>
<Swiper height={ 300 } //高度
showsButtons={false} //显示左右箭头
autoplay={true} //页面自动跳转
autoplayTimeout={ 2.5 } //设置每个页面自动滑动的停留时间
autoplayDirection={ true } //允许控制圆点的方向
index = { 1 } //从第几页开始播放
showsPagination={ true } //显示小圆点，(pagination是页码的意思)
paginationStyle={{ position:'absolute',bottom:10}}
activeDotStyle={{backgroundColor:'#ff7454', width: 10, height: 10}}
horizontal={ true } //滚动的内容横向排列
>
<View style={styles.win}>
<Image source={ require('../8.jpg')} style={styles.img}/>
</View>
<View style={styles.win}>
<Image source={ require('../10.jpg')} style={styles.img2} />
</View>
<View style={styles.win}>
<Image source={ require('../8.jpg')} style={styles.img}/>
</View>
</Swiper>
</View>
)
}else {
return (
<View style={{height:200}}>
<Image source={ require('../8.jpg')} />
</View>
);
}
}
}
react-native-swiper在安卓上与TabNavigator共用时不显示内容问题（这里是巨坑，记得填坑）http://blog.csdn.net/qq_31280709/article/details/73441330
<Image></Image>让图片充满元素
img2: {
width: width,
height:300,
resizeMode: 'stretch'
}
2.array.map(callback,[ thisObject]); （ map在这里是映射的意思）
-
- array.map(callback,[ thisObject]); （ map在这里是映射的意思）
-
callback的参数也类似：
[].map(function(value, index, array) {
// ...
});
-------------------------------------------------------------------
例一：
map方法的作用不难理解，“映射”嘛，也就是原数组被“映射”成对应新数组。下面这个例子是数值项求平方：
var data = [1, 2, 3, 4];
var arrayOfSquares = data.map(function (item) {
return item * item;
});
alert(arrayOfSquares); // 1, 4, 9, 16
callback需要有return值
--------------------------------------------------------------------
例二：
data1 = dataJson.data;
i++;
data1.map( (item)=> {
dataList.push({ //dataList是全局定义的空数组
key: i,
value: item
})
i++;
} )
3.验证码倒计时 setInterval() 和 clearInterval()
coutDown() {
this.setState({
MainTime:60,
MainTimeTitle: ''
});
this.bb = setInterval( () => {
var aa = this.state.MainTime - 1;
if( aa ===0){
clearInterval( this.bb );
this.setState({
MainTime:'',
MainTimeTitle: '重新获取'
})}else{
this.setState({
MainTime: aa,
MainTimeTitle: ''
})
}
},1000)
}
-------------------------------------
<Text
onPress={ this.coutDown.bind(this) }
style={ styles.time}
>{this.state.MainTime}{this.state.MainTimeTitle}
</Text>
(踩坑) ：这样写的话会有个警告（如下，如图）：
countDown()中的bb方法一直在执行
（解决方法）如下：
Waring: Can only update a mounted or mounting component.
分析：可以看到在 countdown方法中每秒中调用一次bb方法去递减秒数，
当组件unmounted之后这个timer并没有停止，所以出现了上面的问题。
--------------------------------------------------------
解决方法：
将每次setInterval返回的ID保存起来，在componentWillUnmount方法中clearInterval
--------------------------------------------------------
完整代码：
//组件将被卸载
componentWillUnmount() {
clearInterval(this.state.timeId)
}
//倒计时
coutDown() {
this.setState({
MainTime:60,
MainTimeTitle: ''
});
this.bb = setInterval( () => {
var aa = this.state.MainTime - 1;
if( aa ===56 ){
clearInterval( this.bb );
this.setState({
MainTime:'',
MainTimeTitle: '重新获取'
})}else{
this.setState({
MainTime: aa,
MainTimeTitle: ''
})
}
},1000)
this.setState({
timeId: this.bb
});
}
http://blog.csdn.net/tujiaw/article/details/58238975
4.(react-native-image-picker)上传头像 + (modal浮层) +（AsyncStorage.setItem-getItem）
//www.greatytc.com/p/04dfef54645c
