React Native条件渲染无法正常工作，需要帮​​助

Question

在我的RN应用中，我尝试根据身份验证状态呈现“抽屉”菜单内容。但是我的代码返回：

ReferenceError: Can't find variable: MenuContent

我对代码结构非常满意，因此我不会更改它，但是我不知道如何修复语法。

这是我的代码：

class DrawerContent extends Component {

  AuthorizedMenuContent = (props) => () => {
    return (
      <SafeAreaView>
        <Text> Authorized </Text>
      </SafeAreaView>
    );
  }

  UnAuthorizedMenuContent = (props) => () => {
    return (
      <SafeAreaView>
        <Text> NOT Authorized </Text>
      </SafeAreaView>
    );
  }

  MenuContent = (props) => () => {
    const isLoggedIn = props.isLoggedIn;
    if (isLoggedIn) {
      return <AuthorizedMenuContent />;
    }
    return <UnAuthorizedMenuContent />;
  }

  render() {
    return (
      <MenuContent isLoggedIn={false}/>      
    );
  }
}

Answer 1

MenuContent，AuthorizedMenuContent和UnAuthorizedMenuContent是函数，而不是组件，您必须以这种方式调用它们：

{this.MenuContent(false)}

您的函数声明不好，您必须替换

MenuContent = (props) => () => {

作者

MenuContent = (props) => {

我在堆栈https://snack.expo.io/@sanjar/so-53390970上创建了一个工作示例