该篇主要记录在react native开发中,标签常用的一些属性,会持续更新
一、文字省略号 numberOfLines
numberOfLines={number} 其中number表示超过多少行时显示省略号,如
<Text numberOfLines={1} style={[styles.itemRightLetter]}>
在文字长度超过一行时,便显示省略号
</Text>
二、文字省略号 &emsp
RN没有专门的属性去处理文字首行缩进多少个字符,但可以用&emsp来实现;一个&emsp代码一个字符
<Text>  该APP基于沙颍河流域水生态环境多目标智能管理平台结构以及业务进行构建。</Text>
三、图片大小控制 resizeMode
resizeMode : “contain” | “cover” | “stretch”;
- cover模式只求在显示比例不失真的情况下填充整个显示区域。可以对图片进行放大或者缩小,超出显示区域的部分不显示, 也就是说,图片可能部分会显示不了。
- contain模式是要求显示整张图片, 可以对它进行等比缩小, 图片会显示完整,可能会露出Image控件的底色。 如果图片宽高都小于控件宽高,则不会对图片进行放大。
- stretch模式不考虑保持图片原来的宽,高比.填充整个Image定义的显示区域,这种模式显示的图片可能会畸形和失真。
例如:
<Image
source={{uri: src}}
resizeMode ='contain'
style={{
width: width,
height: height
}}
onLoad={() => this.setState({loading: 2})}
onError={() => {
console.log(src);
this.setState({loading: 3})
}}
/>