Блог

Я перехожу с expo 37 на expo 42, но столкнулся с проблемой, не связанной с конкретной версией. Наиболее очевидным изменением является то, что теперь архитектура изменилась с компонентов, основанных на классах, на функциональные компоненты. Поэтому я не могу повторно использовать свой код, например, в следующем фрагменте (вы можете протестировать $ expo init test_touchable и заменить App.js)

 import React from 'react';
import { StyleSheet, Text, View, TouchableHighlight } from 'react-native';

// the purpose is to change the activeOpacity property in a systematic way...
class Touchable extends TouchableHighlight {
  constructor(props) {
    super(props)
  }
}
Touchable.defaultProps = {
  activeOpacity: 0.3
}

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <Touchable onPress={() => alert('cucu')}><Text>qwe qwe</Text></Touchable>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});
 

Теперь я получаю эту ошибку,

 $ expo start
Starting project at /home/carlo/test/expo/test_touchable
Developer tools running on http://localhost:19002
Starting Metro Bundler
... etc etc... open expo go using the qr code ...
Logs for your project will appear below. Press Ctrl C to exit.
Android Bundling complete 3465ms
Android Running app on ........

Unable to start your application. Please refer to https://expo.fyi/no-registered-application for more information.
at node_modules/react-native/Libraries/ReactNative/AppRegistry.js:200:6 in runApplication

TypeError: Super expression must either be null or a function
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:171:19 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
at node_modules/expo-error-recovery/build/ErrorRecovery.fx.js:12:21 in ErrorUtils.setGlobalHandler$argument_0

...
 

это намекает на то, что TouchableHighlight это не более чем класс.
Как я могу снова использовать шаблон подкласса ?