import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
TouchableOpacity,
Image,
SectionList,
NavigatorIOS
} from 'react-native';
export default class My extends Component {
componentWillMount(){
}
setctionHeader = ({section})=>{
return (
<View style={{backgroundColor:'#f0f0f0'}}>
{/*{section.key}*/}
<Text style={{backgroundColor:'#f0f0f0',color:'#00bfff'}}></Text>
</View>
);
}
renderItemComponent = ({item})=>{
console.log(item)
return (
<View style={{flexDirection:'row',height:50,alignItems: "center",backgroundColor:"white"}}>
<Text style={{marginLeft:10}}>{item.title}</Text>
<Image style={{marginRight:20}} source={require('./Images/right.png')} />
</View>
);
}
render(){
var sections = [];
var data1 = [];
data1.push({title:"立即发布",key:"1"})
data1.push({title:"我的发布",key:"2"})
var data2 = [];
data2.push({title:"关于我们",key:"3"})
data2.push({title:"意见反馈",key:"4"})
var data3 = [];
data3.push({title:"退出登录",key:"5"})
sections.push({key:"one",data:data1})
sections.push({key:"two",data:data2})
sections.push({key:"three",data:data3})
return (
<View style={styles.container}>
<SectionList style={styles.sectionListStyle}
renderItem={this.renderItemComponent}
renderSectionHeader={this.setctionHeader}
sections={sections}
/>
</View>
);
}
}
var styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor:"#00cadf"
},
rowText:{
height:40,
},
sectionListStyle: {
flex:1,
}
});
/*
_gotoNextPage() {
this.props.navigator.push({
name: 'NextPage',
component: NextPage
});
}
<View style={styles.container}>
<TouchableOpacity style={styles.nextBtn} onPress={this._gotoNextPage.bind(this)}>
<Text style={styles.nextText}>进入下一页</Text>
</TouchableOpacity>
</View>
* */