react-native自定义组件

2018-08-23  本文已影响0人  FantDing

这里的自定义不是通过继承的方式,而是通过组合

一、例子1


class MovieTalk extends Component {
    render() {
        return (
          <View style={styles.container}>
            <HeaderText>hello</HeaderText>
          </View>
        )
    }
}

class HeaderText extends Component{
  render(){
    return (
      <Text style={styles.headerText}>
        {this.props.children}
      </Text>

    )
  }
}

let styles = StyleSheet.create({
  container:{
    flex:1,
    alignItems:"center"
  },
  headerText:{
    fontSize: 60,
    fontWeight:'bold'
  }
})

export default MovieTalk
自定义HeaderText组件
上一篇 下一篇

猜你喜欢

热点阅读