对象作为 React 子对象无效（React Navigation）

Question

我正在使用React Navigation，我想在StackNavigator中添加右键。添加右键后，出现这样的错误：

Object is not valid as React child (found: object with keys {right}). If you meant to render a collection of children, use an array instead

如何修复该错误？

代码如下：

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

class ReviewScreen extends Component {

  static navigationOptions = {
      title: 'Review Jobs',
      header: () => {
          return {
              right: <Text>Go right</Text> 
          };
      }
  }

    render (){
        return (
            <View>
                <Text>ReviewScreen</Text>
            </View>


        );
    }
}

export default ReviewScreen;

Answer 1

您无法在 header 选项中呈现 object。您返回的是 object 而不是文本标签。只需如下更改代码即可使其正常工作：-

      headerRight:<Text>Go right</Text>

而不是：-

      header: () => {
      return {
          right: <Text>Go right</Text> 
      };
  }

Answer 2

不要使用 header。 header 需要一个代表整个 header 的 React 组件，而不是一个普通的 object。使用 headerRight:

static navigationOptions = {
  title: 'Review Jobs',
  headerRight: <Text>Go right</Text>
}

Answer 3

您可以使用 headerRight 道具将 header 的右键设置为自定义按钮。

例子

static navigationOptions = {
  title: 'Review Jobs',
  headerRight:<Text>Go right</Text>
}

对象作为 React 子对象无效（React Navigation）

Objects are not valid as a React child (React Navigation)

javascript

react-native

react-navigation