小编kin*_*o17的帖子

我正在尝试根据isAuthenticated状态渲染某些导航堆栈。我遇到的问题是AppNavigator仅在第一次渲染时渲染，而不进行任何其他更改，我不确定为什么。我尝试在AppNavigator组件中使用 useEffect 来设置辅助本地状态，isAuthenticated但没有执行回调。我把所有相关的内容都放在下面了。我很感激任何建议。

AppNavigator我的文件中正在渲染一个app.tsx。

  return (
    <ToggleStorybook>
      <ApolloProvider client={client}>
        <RootStoreProvider value={rootStore}>
          <SafeAreaProvider initialMetrics={initialWindowMetrics}>
            <ErrorBoundary catchErrors={"always"}>
              <AppNavigator
                initialState={initialNavigationState}
                onStateChange={onNavigationStateChange}
              />
            </ErrorBoundary>
          </SafeAreaProvider>
        </RootStoreProvider>
      </ApolloProvider>
    </ToggleStorybook>
  )

正在AppNavigator回归

export const AppNavigator = (props: NavigationProps) => {
  const { isAuthenticated } = useStores()
  const colorScheme = useColorScheme()
  useBackButtonHandler(canExit)

  return (
    <NavigationContainer
      ref={navigationRef}
      theme={colorScheme === "dark" ? DarkTheme : DefaultTheme}
      {...props}
    >
      <Stack.Navigator
        screenOptions={{
          headerShown: false,
        }}
      >
        {isAuthenticated ? ( …

我正在建立一个部分列表。每个部分都有一个具有不同值的不同数据对象。因此，我需要为每个部分渲染不同的组件，但我很难弄清楚如何做到这一点。

这是我的DATA数组（现在有两个是虚拟的）

const DATA = [
{
  title: "Groups",
  data: [
    {
      groupName: "Samwise",
    },
    
  ],
},
{
  title: "Noters"
    {
      userName: "Merri",
    },
  ],
},
{
  title: "Contacts",
  data: termIsContact.length ? termIsContact : contacts,
}]

部分列表组件

<SectionList
  sections={DATA}
  keyExtractor={(item, index) => item + index}
  renderItem={renderItem}
  renderSectionHeader={({ section: { title } }) => (
    <View style={tw.style(`justify-center bg-red-100 pl-4`, { height: 28 })}>
      <Text style={tw`text-base font-bold`}>{title}</Text>
    </View>
  )}
/>

我如何呈现联系人列表

const Item = ({ givenName, familyName }) => ( …