You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Describe the bug
Using a SwipeListView with useSectionList={true} actions will pass the wrong item in the RowMap properties. For this case I am using onRightAction.
The issue seems to occur because each section has it's own rowKey, but the rowMap selected is always the map for the final section. So rowMap[rowKey].props.item will always return the respective item for the final section no matter which is swiped.
E.g:
Swipe the first item in the first section --> item passed is section3[0]
Swipe the first item in the second section --> item passed is section3[0]
Swipe the first item in the third section --> item passed is section3[0]
To Reproduce
Here is a minimum viable example, notice the incorrect item will be logged on swipe.
import { Text, View } from "native-base"
import { RowMap, SwipeListView } from 'react-native-swipe-list-view';
const Notifications = () => {
const sectionA = [
{
id: 10,
message: 'Message 1',
section: 'Section A'
},
{
id: 11,
message: 'Message 2',
section: 'Section A'
},
{
id: 12,
message: 'Message 3',
section: 'Section A'
}
]
const sectionB = [
{
id: 20,
message: 'Message 1',
section: 'Section B'
},
{
id: 21,
message: 'Message 2',
section: 'Section B'
},
{
id: 22,
message: 'Message 3',
section: 'Section B'
}
]
const sectionC = [
{
id: 30,
message: 'Message 1',
section: 'Section C'
},
{
id: 31,
message: 'Message 2',
section: 'Section C'
},
{
id: 32,
message: 'Message 3',
section: 'Section C'
}
]
let sections =
[
{
title: "SECTION A",
data: sectionA
},
{
title: "SECTION B",
data: sectionB
},
{
title: "SECTION C",
data: sectionC
}
]
// Swiping
const onRightAction = (rowKey: string, rowMap: RowMap<any>) => {
// !!! This is broken. rowMap currently passes in the incorrect object when using SectionList
// - regardless of item swiped, rowMap[rowKey] will use the the index on the last list of content
const item = rowMap[rowKey].props.item
console.log('onRightAction, rowKey:', rowKey);
console.log('rowData', rowMap[rowKey])
console.log('item', item)
}
const onLeftAction = (rowKey: string, rowMap: RowMap<any>) => {
console.log('onLeftAction, rowKey:', rowKey);
}
const renderHiddenItem = () => {
return (
<></>
)
}
return (
<View>
<SwipeListView
style={{
padding: 15
}}
useSectionList={true}
sections={sections}
renderItem={({ item }) =>
<Text>{item.message}</Text>
}
renderHiddenItem={renderHiddenItem}
leftActivationValue={150}
leftActionValue={500}
rightActivationValue={-150}
rightActionValue={-500}
onLeftAction={onLeftAction}
onRightAction={onRightAction}
renderSectionHeader={({ section }) => (
<Text>{section.title}</Text>
)}
keyExtractor={(item, index) => `${index}`}
/>
</View>
);
}
export default Notifications
Environment
OS: only tested on iOS
RNSLV Version: v3.2.9
RN Version: v0.70.4
The text was updated successfully, but these errors were encountered:
Describe the bug
Using a SwipeListView with useSectionList={true} actions will pass the wrong item in the RowMap properties. For this case I am using onRightAction.
The issue seems to occur because each section has it's own rowKey, but the rowMap selected is always the map for the final section. So rowMap[rowKey].props.item will always return the respective item for the final section no matter which is swiped.
E.g:
Swipe the first item in the first section --> item passed is section3[0]
Swipe the first item in the second section --> item passed is section3[0]
Swipe the first item in the third section --> item passed is section3[0]
To Reproduce
Here is a minimum viable example, notice the incorrect item will be logged on swipe.
Environment
The text was updated successfully, but these errors were encountered: