React Native ListView 长按删除

项目中React Native ListView的长按删除功能分享(基于ES5)：

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React,{Component} from 'react';
import {
    AppRegistry,StyleSheet,Text,View,ListView,TouchableOpacity
} from 'react-native';

var ds = new ListView.DataSource({
    rowHasChanged: (r1,r2) => {
        r1 !== r2
    }
});

var rows = ['row 1','row 2','row 3','row 4','row 5','row 6'];

var XXX = React.createClass({

    getInitialState() {
        return {
            dataSource: ds.cloneWithRows(rows),};
    },_deleteRow(rowID) {
        delete rows[rowID];
        this.setState({dataSource: ds.cloneWithRows(rows)})
    },renderRow(rowData,sectionID,rowID) {
        return <TouchableOpacity onLongPress={()=>this._deleteRow(rowID)}
                                 style={{height: 60,flex: 1,borderBottomWidth: 1}}>
            <Text>{rowData}</Text>
        </TouchableOpacity>
    },render() {
        return (
            <ListView
                dataSource={this.state.dataSource}
                renderRow={this.renderRow}
            />
        );
    }



});

AppRegistry.registerComponent('XXX',() => XXX);

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!