Question

我使用NavigatorIOS为使用React Native的iOS应用程序设置了一个简单的两页。加载我的应用程序后，我可以点击进入第二页，但是当我点击后面（左上角）时，我收到以下错误：

Unsupported top level event type "topScroll" dispatched

extractEvents
ReactNativeFiber-dev.js:3519:22

extractEvents
ReactNativeFiber-dev.js:3298:71

handleTopLevel
ReactNativeFiber-dev.js:3539:64

<unknown>
ReactNativeFiber-dev.js:3560:55

batchedUpdates
ReactNativeFiber-dev.js:2754:26

batchedUpdatesWithControlledComponents
ReactNativeFiber-dev.js:209:34

_receiveRootNodeIDEvent
ReactNativeFiber-dev.js:3559:50

receiveEvent
ReactNativeFiber-dev.js:3564:60

__callFunction
MessageQueue.js:302:47

<unknown>
MessageQueue.js:116:26

__guard
MessageQueue.js:265:6

callFunctionReturnFlushedQueue
MessageQueue.js:115:17

在模拟器和设备上运行时出错（来自xcode）。

这是我的应用程序的代码。我确定我没有正确地初始化一些东西，我似乎无法找出它是什么：

'use strict';

import React, { Component } from 'react';
import {
  StyleSheet,
  Button,
  Text,
  View,
  NavigatorIOS
} from 'react-native';

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  scene: {
    padding: 10,
    paddingTop: 74,
    flex: 1,
  }
})

class PageFeedItem extends Component {
  render() {
    return(
      <View style={styles.scene}>
        <Text>Some text</Text>
      </View>
    );
  }
}

class PageFeed extends Component {
  constructor(props, context) {
    super(props, context);

    this.onShowFeedItem = this.onShowFeedItem.bind(this);
  }

  onShowFeedItem() {
    this.props.navigator.push({
      component: PageFeedItem,
      title: "Feed Item",
      passProps: {}
    });
  }

  render() {
    return(
      <View style={styles.scene}>
        <Text>Feeds</Text>
        <Button onPress={this.onShowFeedItem} title="Show Item"/>
      </View>
    );
  }
}

class Main extends Component {
  render() {
    return (
      <NavigatorIOS
        style={styles.container}
        initialRoute={{
          component: PageFeed,
          title: 'Home',
          passProps: {},
        }}
      />
    );
  }
}

export default Main;

更新

自从提出这个问题以来，我注意到了两件事：

1）当发生错误时，按ESC键，应用程序似乎继续没有问题。

2）向第二页添加一个按钮并添加一个处理程序以执行this.props.navigator.pop();似乎工作正常，即无法解决错误。

Answer 1

我也面临同样的问题，然后将react-native版本从0.50更改为0.49。*一切正常。它是一个已知的bug最新版本的本地反应

Answer 2

使用ScrollView包裹屏幕。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="nav">
  <li class="wsite-menu-item-wrap"><a href="#">Home</a></li>
  <li class="wsite-menu-item-wrap"><a href="#">About</a></li>
  <li class="wsite-menu-item-wrap"><a href="#">Contact</a></li>
</div>

Answer 3

尝试在PageFeed类中添加此代码：

formatR::tidy_source()

Answer 4

将directionalLockEnabled={false}添加到ScrollView可以为我解决。

在这里找到它：https://github.com/facebook/react-native/issues/2962#issuecomment-142768841

调度不支持的顶级事件类型“topScroll”

4 个答案: