Closing SwipeRow inside FlatList using Native-Base - react-native

Question

How can I close SwipeRow inside FlatList?
This is the easy thing to do with ListView, but since the next release is going to use FlatList it should be possible.
From reading their source code, it seems like it is not implemented yet.

Answer 1

can you try this
import React, { Component } from 'react';
import { FlatList } from 'react-native';
import { Container, Header, Content, SwipeRow, View, Text, Icon, Button } from 'native-base';
export default class App extends Component {
constructor(props) {
super(props)
this.state = { data: [{ key: 'a' }, { key: 'b' }] }
this.component = [];
this.selectedRow;
}
render() {
return (
<Container>
<Header />
<Content>
<FlatList
data={[{ key: 'a', value: 'Row one' }, { key: 'b', value: 'Row two' }, { key: 'c', value: 'Row three' }, { key: 'd', value: 'Row four' }, { key: 'e', value: 'Row five' }]}
keyExtractor={(item) => item.key}
renderItem={({ item }) => <SwipeRow
ref={(c) => { this.component[item.key] = c }}
leftOpenValue={75}
rightOpenValue={-75}
onRowOpen={() => {
if (this.selectedRow && this.selectedRow !== this.component[item.key]) { this.selectedRow._root.closeRow(); }
this.selectedRow = this.component[item.key]
}}
left={
<Button success onPress={() => alert('Add')}>
<Icon active name="add" />
</Button>
}
body={
<View style={{ paddingLeft: 20 }}>
<Text>{item.value}</Text>
</View>
}
right={
<Button danger onPress={() => alert('Delete')}>
<Icon active name="trash" />
</Button>
}
/>}
/>
<Button style={{ margin: 20 }} onPress={() => this.selectedRow._root.closeRow()}><Text>Close row</Text></Button>
</Content>
</Container>
);
}
}