TaskQueue: ошибка с задачей: undefined не является объектом (оценивает '_this.view._component.measureInWindow') в реагирующем нативе. - PullRequest
5 голосов
/ 31 марта 2020

Я очень новичок, чтобы реагировать на нативные, я столкнулся с этой проблемой с очень простым демонстрационным приложением при обработке экранной навигации. Получение этого сообщения об ошибке TaskQueue: Ошибка с задачей: undefined не является объектом (оценивает _this.view._component.measureInWindow ')

Вот снимок экрана с ошибкой:

enter image description here

вот мой код приложения. js

import React, {Component} from 'react';
import {createStackNavigator} from 'react-navigation';
import HomeActivity from './components/HomeActivity';
import ProfileActivity from './components/ProfileActivity';
const RootStack = createStackNavigator(
  {
    Home: {
      screen: HomeActivity,
    },
    Profile: {
      screen: ProfileActivity,
    },
  },
  {
    initialRouteName: 'Home',
  },
);
export default class App extends Component {
  render() {
    return(
    <RootStack />
    );
  }
}

HomeActivity. js

import React, {Component} from 'react';
import {StyleSheet, Text, View, Button} from 'react-native';
class HomeActivity extends Component {
  static navigationOptions = {
    title: 'Home',
    headerStyle: {backgroundColor: '#03A9F4'},
    headerTintColor: '#fff',
    headerTitleStyle: {fontWeight: 'bold'},
  };
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.headerText}>Home Activity</Text>
        <Button
          title="Go to Profile Activity"
          onPress={() => this.props.navigation.navigate('Profile')}
        />
      </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  headerText: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
    fontWeight: 'bold',
  },
});
export default HomeActivity;

ProfileActivity. js

import React, {Component} from 'react';
import { StyleSheet, Text, View, Button} from 'react-native';
class ProfileActivity extends Component {
  static navigationOptions = {
    title: 'Profile',
    headerStyle: {backgroundColor: '#73C6B6'},
  };
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.headerText}>Profile Activity</Text>
        <Button
          title="Go to Home"
          onPress={() => this.props.navigation.navigate('Home')}
        />
        <Text style={styles.headerText}>Create a New Profile Screen </Text>
        <Button
          title="Go to new Profile"
          onPress={() => this.props.navigation.push('Profile')}
        />
        <Text style={styles.headerText}> Go Back </Text>
        <Button
          title="Go Back"
          onPress={() => this.props.navigation.goBack()}
        />
      </View>
    );
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  headerText: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
    fontWeight: 'bold',
  },
});
export default ProfileActivity;

 "dependencies": {
    "@react-native-community/masked-view": "^0.1.7",
    "@react-navigation/native": "^5.1.4",
    "react": "16.11.0",
    "react-native": "0.62.0",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-paper": "2.1.3",
    "react-native-reanimated": "^1.7.1",
    "react-native-safe-area-context": "^0.7.3",
    "react-native-screens": "^2.4.0",
    "react-navigation": "2.6.2"
  }

1 Ответ

11 голосов
/ 04 апреля 2020

Это происходит из-за использования старой версии SafeView для обратной реакции.

У вас есть 2 способа:

1. Длинный путь: необходимо перейти на v5 реагировать-навигация миграция с v4 на v5 .

Для меня это сложно и потребует слишком много изменений в моем проекте.

2. Очень быстрое и безобразное решение:

Go для dir YOUR_PROJECT_PATH / node_modules / Reaction-native-Safe-Area-View / Index. js и обновление:

из:

this.view._component.measureInWindow((winX, winY, winWidth, winHeight) => {

до:

this.view.getNode().measureInWindow((winX, winY, winWidth, winHeight) => {

ОБНОВЛЕНО : Вы можете попробовать мою вилку:

"react-navigation": "git://github.com/Snailapp/react-navigation.git#2.18.4",

"react-navigation": "git://github.com/Snailapp/react-navigation.git#2.18.5", -> исправить предупреждения

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...