React Native expo react-native-gesture-handler 根本不工作答案

【问题标题】：React Native expo react-native-gesture-handler not working at allReact Native expo react-native-gesture-handler 根本不工作
【发布时间】：2021-12-29 04:33:01
【问题描述】：

我正面临这个奇怪的问题。滑动 Swipeable 元素时根本没有活动。这可能是一个版本问题，因为我在 git 上看到很少有可用的示例具有不同的版本，但由于它们已有多年历史，因此无法使用。请帮忙。

这是 package.json >

"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "0.64.3",
"react-native-gesture-handler": "^2.1.0"

这是代码

import {Text,View,TouchableHighlight,StatusBar as SB} from 'react-native';
import {MaterialCommunityIcons} from '@expo/vector-icons';
import { FlatList, Swipeable } from 'react-native-gesture-handler';

const messages = [
  {
    id: 1,
    title: "T1",
  },
  {
    id: 2,
    title: "T2",
  }, {
    id: 3,
    title: "T3",
  },
  {
    id: 4,
    title: "T4",
  }
]

const generateColor = () => {
 const colors = ['tomato','green','purple','yellow'];
 return colors[Math.floor(Math.random() * colors.length)]
}
export default function App() {  
return (
  <FlatList
    style={{
      flex:1,
      paddingTop:SB.currentHeight
    }}
    data={messages}
    keyExtractor={message=>message.id.toString()}
    renderItem={message=>
    <Swipeable
      renderRightActions={()=>
      <View style={{
        width:70,
        backgroundColor:'red',
        height:70
      }}>

      </View>
    }>
      <TouchableHighlight
          underlayColor={generateColor()}
        onPress={()=>console.log("touched",message.item.title)}>
        <View style={{
          padding:20,
        }}>
          <Text>
            {message.item.title}
          </Text>
        </View>
      </TouchableHighlight>
    </Swipeable>
    }
    ItemSeparatorComponent={()=><View style={{
      width:'100%',
      height:1,
      backgroundColor:'black'
    }}></View>}
  >

  </FlatList>
);
}

【问题讨论】：

标签： reactjs react-native expo react-native-flatlist react-native-gesture-handler

【解决方案1】：

很尴尬，因为没有编译错误，我忘记为这个功能组件导入 react ......因为第三方组件在运行时需要它......

因此，它是固定的。

【讨论】：