导航回NavigatorIOS本机响应

时间:2018-08-29 07:10:03

标签: javascript react-native navigator-ios

我正在我的react native项目中测试NavigatorIOS。问题是当我按下按钮从一个组件导航到另一个组件时没有问题,但是当我尝试使用NavigatorIOS产生的标题栏中的按钮返回时,出现以下错误:“不支持的顶级事件“ topScroll”派遣”。

我使用react-native-cli = 2.0.1和react-native = 0.56.0

注意:当我按“支持”组件中的“返回”按钮时,一切都很好。

这是我的代码:

应用程序组件:

from clint.textui import prompt, validators


class InputValidator(object):
    message = 'Input is not valid.'

    def __init__(self, fun, message=None, *args):
        if message is not None:
            self.message = message
        self.my_function = fun
        self.my_args = args

    def __call__(self, value):
        """
        Validates the input.
        """
        try:
            return self.my_function(value, *self.my_args)
        except (TypeError, ValueError):
            raise validators.ValidationError(self.message)


def custom_validation_1(value, number):
    if int(value) > int(number):
        return value
    else:
        raise ValueError


answer = prompt.query(f'Insert range in days:',
                      '365',
                      validators=[InputValidator(custom_validation_1,
                                                 "Must to be greater than 10",
                                                 10)],
                      batch=False)
print(answer)

NavigationApp组件:

import React, { Component } from "react";
import { View, NavigatorIOS } from "react-native";

import { NavigationApp } from "./src/components/index.js";

export default class App extends Component {
  render() {
    return (
      <NavigatorIOS
        style={{ flex: 1 }}
        initialRoute={{
          title: "Navigation app",
          component: NavigationApp
        }}
      />
    );
  }
}

支持组件:

import React, { Component } from "react";
import { Text, View, Button, NavigatorIOS } from "react-native";
import { Support } from "./index.js";

class NavigationApp extends Component {
  navigateToSupport = () => {
    this.props.navigator.push({
      title: "Support",
      component: Support
    });
  };

  render() {
    const { containerStyle } = styles;
    return (
      <View style={containerStyle}>
        <Button
          title="Go to support page"
          onPress={this.navigateToSupport}
        />
      </View>
    );
  }
}

const styles = {
  containerStyle: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center"
  }
};

export { NavigationApp };

1 个答案:

答案 0 :(得分:3)

解决方法是将初始组件包装在ScrollView

<ScrollView>
  // ... Initial Component code 
</ScrollView>

这是一个悬而未决的问题,您可以按照线索here