react-native的技巧

按钮定制

給图片添加点击事件

<TouchableOpacity onPress={this.lookAlbum} style={{flex: 0,
        height: 40,
        width: 40,
        borderRadius: 5,
        alignSelf: 'center',}}>
         <Image
             style={styles.imgPreview}
             source={{uri: this.state.currentUri || 'https://yyb.gtimg.com/aiplat/page/product/visionimgidy/img/demo6-16a47e5d31.jpg?', isStatic: true}}
          />
 </TouchableOpacity>

文字自定义按钮：

 <TouchableOpacity onPress={this.swtichCamera} style={{}}>
       <Text style={{ fontSize: 14 }}> 切换 </Text>
 </TouchableOpacity>

当字数太多的时候我们需要省略号来显示多余的字，使用Text的属性

第一个是：(几行显示)

<Text numberOfLines={1}/>

第二个是：(省略号显示的位置)

默认的是tail (尾部)

头部 head

中间 middle

从尾部截掉 clip

<Text numberOfLines={1} ellipsizeMode={'tail'}>

4. TextInput 多行时，在android 上怎么解决垂直居中问题。
   解决办法:这个有2种解决办法（都是设置style 里面的某个属性）设置其左对齐且顶端对齐。
   代码示例1

<TextInput
placeholder="请描述您的问题"
multiline = {true} //开区多行
numberOfLines = {8} //最多8行
style={contentStyles.textInput_mult}
maxLength={maxInputWordLength} //设置最多能输入多少个字
underlineColorAndroid="transparent">

const styles = StyleSheet.create({
textInput_mult:{
textAlign:'left',
textAlignVertical:'top',
alignSelf:'flex-start',
justifyContent:'flex-start',
alignItems:'flex-start',
}
});