TypeError: render is not a function. (In 'render(newValue)', 'render' is an instance of Object)

Question

import{ React, useContext} from 'react';  
import { Button, View, Text } from 'react-native';  
import { NavigationContainer, useNavigation ,useRoute } from '@react-navigation/native';  
import { createNativeStackNavigator } from '@react-navigation/native-stack';  
import { LoginContexts } from '../Contexts/LoginContexts';  


function Screen2() {
  
  const {getEmail} = useContext(LoginContexts);
  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <LoginContexts.Consumer >
        <Text>{getEmail}</Text>   
      </LoginContexts.Consumer> 
    </View>
  );
}

export default Screen2;

这是我的消费者部分，我想在其中显示 getEmail 中存在的文本文本视图。请帮助解决这个问题。

Answer 1

问题是 LoginContexts.Consumer 组件需要渲染函数。

Context.Consumer

<MyContext.Consumer>
  {value => /* render something based on the context value */}
</MyContext.Consumer>

useContext钩子是消费者，去掉LoginContexts.Consumer组件。

function Screen2() {
  const {getEmail} = useContext(LoginContexts);
  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Text>{getEmail}</Text>
    </View>
  );
}

TypeError: render is not a function. (In 'render(newValue)', 'render' is an instance of Object)

TypeError: render is not a function. (In 'render(newValue)', 'render' is an instance of Object)

javascript

reactjs

react-native

react-context