如何使用react-native-gesture-handler按下或滑动另一个项目时滑动回一个项目？

Question

我正在尝试使用 react-native-gesture-handler 取消滑动或按下另一个项目时的滑动操作

（向后滑动）

。我试图从这个零食post中获得帮助，但我无法实现。也做了这篇post中提到的方法，但还是没有运气，我被卡住了。

我简单写下我所做的事情： List.js 文件：

const List = () => {
  let prevOpenedRow;
  let row = []
  ...
  return (
   <FlatList 
     data={dataArray}
     keyExtractor={(item)=>item.id}
     renderItem={({item, index})=> <Child item={item} index={index} row={row} prevOpenedRow={prevOpenedRow}  />}
   />
)}

Child.js 文件：

const Child = ({item, index, row, prevOpenedRow}) => {

   const closeRow = (index) => {
      console.log("prevOpenedRow",prevOpenedRow)  // everytime output is undefined
      if (prevOpenedRow && prevOpenedRow !== row[index]) {
        prevOpenedRow.close()
      }
      prevOpenedRow = row[index]
   }
return (
  <Swipeable
      renderRightActions={swipeRightComps}
      ref={(ref) => (row[index] = ref)}
      onSwipeableOpen={(direction) => {
        closeRow(index)
      }}
  >
   ......
  </Swipeable>
)}

Answer 1

您需要在更改持续存在的地方管理 preOpenedRow。您需要使用 refs 或 React's state

 来跟踪 

打开的行

尝试如下所示：

List.js

const prevOpenedRow = useRef(null);

Child.js

const closeRow = (index) => {
if (prevOpenedRow.current && prevOpenedRow.current !== row[index]) {
  prevOpenedRow.current.close();
}
prevOpenedRow.current = row[index];
};