我是React Native的新手，我正在尝试创建一个带有标签导航的简单应用程序来获取NBA数据。我创建了一个带有2个按钮的团队页面来获取东部或西部联盟团队数据。我尝试将App.js中的所有参数传递给Team.js。这意味着在单击按钮时从API中获取数据。
然而，当我尝试按下团队中的按钮时发生了错误（类别组件中的两个按钮）错误：类别. js：13：70类型错误：undefined不是函数，js引擎：hermes）... Category.js（团队页面中的组件）中使用的函数（confOncClick）未定义
错误截图：Error
App.js

import React, {useState} from 'react';
import {View, Text, StyleSheet, FlatList, Alert} from 'react-native';
import {NavigationContainer} from '@react-navigation/native';
import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
import {v4 as uuid} from 'uuid';
import 'react-native-get-random-values';

import Team from './pages/Team';
import Header from './components/Header';
import Home from './pages/Home';

import axios from 'axios';

const App = () => {
  const [teamData, setTeamData] = useState([]);
  const [confIndex, setConfIndex] = useState();

  function SettingsScreen() {
    return (
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
        <Text>Settings!</Text>
      </View>
    );
  }

  const Tab = createBottomTabNavigator();

  const confOnClick = async text => {
    console.log(text);
    if (text === 'East') {
      setConfIndex(0);
    } else {
      setConfIndex(1);
    }
    const options = {
      method: 'GET',
      url: 'https://api-nba-v1.p.rapidapi.com/teams',
      params: {conference: text},
      headers: {
        'X-RapidAPI-Key': /.../,
        'X-RapidAPI-Host': 'api-nba-v1.p.rapidapi.com',
      },
    };
    await axios
      .request(options)
      .then(function (response) {
        console.log(response.data.response);
        console.log(typeof response.data.response);
        setTeamData(response.data.response);
      })
      .catch(function (error) {
        console.error(error);
      });
  };

  return (
    <View style={styles.container}>
      <Header />
      <NavigationContainer>
        <Tab.Navigator screenOptions={{headerShown: false}}>
          <Tab.Screen name="Home" component={Home} />
          <Tab.Screen
            name="Team"
            component={Team}
            options={{confOnClick: confOnClick, teamData: teamData}}
          />
          <Tab.Screen name="Settings" component={SettingsScreen} />
        </Tab.Navigator>
      </NavigationContainer>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});

export default App;

Team.js

import React from 'react';
import {View, StyleSheet, FlatList, Alert} from 'react-native';
import ListItem from '../components/ListItem';
import Category from '../components/Category';

function Team({confOnClick, teamData}) {
  return (
    <View>
      <Category confOnClick={confOnClick} />
      <FlatList
        data={teamData}
        renderItem={({item}) => <ListItem item={item} />}
      />
    </View>
  );
}
export default Team;

Category.js

import React from 'react';
import {View, StyleSheet, FlatList, Alert} from 'react-native';
import ListItem from '../components/ListItem';
import Category from '../components/Category';

function Team({confOnClick, teamData}) {
  return (
    <View>
      <Category confOnClick={confOnClick} />
      <FlatList
        data={teamData}
        renderItem={({item}) => <ListItem item={item} />}
      />
    </View>
  );
}
export default Team;

传递到类别的confOnClick似乎未定义，但我不确定是什么问题。可能是因为我从app.js传递的方式？

<Tab.Screen
            name="Team"
            component={Team}
            options={{confOnClick: confOnClick, teamData: teamData}}
          />

我希望我说得很清楚，请让我知道，如果我可以提供更多的信息
我试过在Tab中用不同的方式传递参数。屏幕导航器中有initialParams、params、options，还将组件更改为子组件，但不知何故我没有得到正确的。