deanmcpherson / react-native-sortable-listview

Drag drop capable wrapper of ListView for React Native

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Is it possible to delete items from the component?

AFMW opened this issue · comments

commented

Im receiving the imagenesArray from a fetch im doing before all of this.
I load the images and touching the X over the image i have it gets deleted but it holds the row on the listview as it would still exists.

the 'imagenesArray' array is like this = ["www.someimageurl.com","www.someimageurl.com"]

this first screenshot is when i receive the images:
screen shot 2018-03-02 at 12 26 32 pm

this second screenshot is when i touch the "X" icon on the image i wanna delete
screen shot 2018-03-02 at 12 26 55 pm

`
borrarItem(index){
console.log(index)
this.state.imagenesArray.splice(index , 1)
imagenesRecibidasNuevo = this.state.imagenesArray
this.setState({imagenesArray:{}})
this.forceUpdate(); //Im trying to refresh the view but it doesnt work
Actions.refresh() //Im trying to refresh the view but it doesnt work
}

<SortableListView
key={"sortable"}
style={{flex: 1, marginBottom: 0, marginTop:80}}
data={this.state.imagenesArray}
order={order}
onRowActive={(rowData, touch, layout) =>{console.log(rowData), console.log(touch),console.log(layout)}}
onRowMoved={e => {
order.splice(e.to, 0, order.splice(e.from, 1)[0]);
console.log(order)
this.forceUpdate();
}}
renderRow={(rowData, section, index) => <TouchableHighlight key={index} style={{ height:130, borderBottomWidth:1, borderColor: "#eee"}} {...this.props.sortHandlers}>
<Image style={{height:width.height/8, width:width.width/5, marginTop:15, position:"absolute", zIndex:-10}} source={{uri: rowData}} indicator={ProgressBar}
indicatorProps={{size: 20,borderWidth: 2,animated: true,indeterminate:true,color: "#008dde",unfilledColor: 'rgba(200, 200, 200, 0.2)'}}>

                                                                <View>
                                                                <Text allowFontScaling={false} style={{left:5}}><Icon  
                                                                                          name={"cross"}
                                                                                          size={22}
                                                                                          color={'red'}
                                                                                          onPress={() => {
                                                                                            this.borrarItem(index)
                                                                                            }
                                                                                          }   
                                                                                    /></Text>
                                                               </View>
                                                           </TouchableOpacity>
                                                      </Image>
                                              </TouchableHighlight>}
  />

`

@AFMW can you clean up your code formatting and make this is the smallest possible code sample to show your question?