Question

我试图使用react-navigation v2。这就是我的App组件的样子：

import React, { Component } from 'react';
import { createStackNavigator } from 'react-navigation';

import FirstScreen './firstscreen';
import SecondScreen './secondscreen';

const AppNavigator = createStackNavigator(
  {
    FirstScreen: { screen: FirstScreen },
    SecondScreen: { screen: SecondScreen },
  },
  {
    initialRouteName: 'FirstScreen',
    headerMode: 'none'
  }
);

export default class App extends Component {

  render() {
    return (
      <AppNavigator />
    )
  }
}

执行此操作会导致此错误：

Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead.

我发现了一些像这样使用StackNavigator的例子，也许我错过了一些东西。在docs中它看起来是一样的。

但是，如果我这样做，它实际上工作正常。

export default AppNavigator;

我想改变它，因为我试图通过MobX商店。

之前是否有人遇到此问题？提前谢谢你们。

Edit1：我发现的内容：只发生在Android设备上，本机反应原点运行正常。

解决我们使用此Symbol npm package来支持JS Symbol。这导致了错误。删除此软件包解决了这个问题。

Answer 1

如果您忘记导入文件，请将其添加到常量的上方，例如

import FirstScreen ./from/your/path/Firstscreen

但是，当您的export default AppNavigator;工作正常时，您可能需要在第一个屏幕文件中进行任何其他更改。

检查您的第一个屏幕文件的导出类，如下所示。

export default class Firstscreen extends React.Component {}

react-native navigation v2 - 对象作为React子对象无效

1 个答案: