react native声明组件的两种方式
2015-11-27 10:25
597 查看
react native声明组件的两种方式,其中componentWillMount和construtor的作用是一样,都是渲染页面之前做一些业务逻辑。
方式一:var ShopIndex = React.createClass({ componentWillMount:function(){ this.props.navComponent.setNavItems({ rightItem: { component: ( <TouchableOpacity style={[styles.navItem, {marginRight: 7}]}> <Image style={{width: 20, height: 20}} source={{uri: shareImg}}/> </TouchableOpacity> ), event: function() { this.props.navigator.push({ title: '购物车', component: <Cart/> }); }.bind(this) } }); }, render: function() { return ( <View style={styles.container}> <ViewPagerUI/> <GoodsTab/> </View> ); } });
方式二:
class ShopIndex extends Component{ constructor(props) { super(props); this.props.navComponent.setNavItems({ rightItem: { component: ( <TouchableOpacity style={[styles.navItem, {marginRight: 7}]}> <Image style={{width: 20, height: 20}} source={{uri: shareImg}}/> </TouchableOpacity> ), event: function() { this.props.navigator.push({ title: '购物车', component: <Cart/> }); }.bind(this) } }); } render() { return ( <View style={styles.container}> <ViewPagerUI/> <GoodsTab/> </View> ); } }
相关文章推荐
- 纪念博客开通
- Html DOM、Ext Element及Component三者之间的区别(Ext入门基础)
- spring学习Component注解问题
- Android 中 IntentService 的原理及使用
- Android Content Providers(三)——Contacts Provider
- Android Content Providers(二)——Contacts Provider
- Android 内容提供者——Content Providers(一)
- Android Activity 分析
- Android中Broadcast Receiver组件详解
- Android中Context详解
- Android中Service(服务)详解
- Android Activity和Intent机制学习笔记
- Android应用的UI设计
- spring学习笔记-2
- Spring注解@Component、@Repository、@Service、@Controller区别
- spring Scheduled cron定时调度时间的设置
- @Repository、@Service、@Controller 和 @Component
- SpringMVC的四个基本注解annotation
- spring annotation注解@Component 通用:@Controller,@ Service,@ Repository区别
- Spring注解详解