react常用语法

1、获取dom结构

<div className="Component_projress"
             ref="projressBar"

js中：

let projressBar = this.refs.projressBar;

 2、将图片作为背景图

<Image
        source={require('./hello.jpg')} >
        <Text style={{fontSize: 50, color: 'red',}}>HELLO WORLD</Text>
      </Image>

内容写在 

Image 标签里面便可以。

3、将图片作为满屏

const styles = StyleSheet.create({
  backgroundImage:{
    flex:1,
    alignItems:'center',
    justifyContent:'center',
    width:null,
    height:null,
    //不加这句，就是按照屏幕高度自适应
    //加上这几，就是按照屏幕自适应
    //resizeMode:Image.resizeMode.contain,
    //祛除内部元素的白色背景
    backgroundColor:'rgba(0,0,0,0)',
  }
});

 4、使用多种样式

在标签上使用多个css样式的时候要用[]给括起来，并且行内样式的优先级大于StyleSheet定义的样式

style={[styles.button, {backgroundColor: this.props.bg}]

 

转载于:https://www.cnblogs.com/haonanZhang/p/7470751.html