React Native 之ListView1

//导入json数据
var Heros = require('./heros.json');//数组
var Dimensions = require('Dimensions');
var {width} = Dimensions.get('window');


export default class Demo extends Component {
    //构造函数中初始化数据
    constructor(props){
        super(props);
        var ds = new ListView.DataSource({rowHasChanged:(r1,r2)=>r1 !== r2});
        this.state={
            dataSource:ds.cloneWithRows(Heros)
        };
    }

    render() {
        return (
            
        );
    }
    //返回具体的Cell
    renderRow(rowData, sectionID, rowID, highlightRow){
        return(
          {AlertIOS.alert('购买成功!','成功解锁'+rowData.name+'英雄!')}}
          >
            
                {/*左边的图片*/}
                
                {/*右边的View*/}
                
                    {/*上面是英雄名称*/}
                    {rowData.name}
                    {/*下面是英雄描述*/}
                    {rowData.title}
                
            
          
        )
    }
}

const styles = StyleSheet.create({
    cellViewStyle:{
        //分割线
        borderBottomWidth:0.5,
        borderBottomColor:'#e8e8e8',
        //cell内部缩一下
        padding:10,
        //主轴横过来
        flexDirection:'row'

    },
    leftImageStyle:{
        width:60,
        height:60,
        marginRight:15
    },
    rightViewStyle:{

    },
    topTitleStyle:{
      fontSize:20,

    },
    bottomTitleStyle:{
        width:width * 0.7,
        marginTop:8
    }
});