索引在反应导航状态下做什么

Question

我正在通过React-navigation reset actions from their docs

他们在哪里共享了如下所示的 sn-p 示例

import { CommonActions } from '@react-navigation/native';

navigation.dispatch(
  CommonActions.reset({
    index: 1,
    routes: [
      { name: 'Home' },
      {
        name: 'Profile',
        params: { user: 'jane' },
      },
    ],
  })
);

从她那里我无法弄清楚 index 是做什么的？

我浏览了react-navigation docs 的状态对象，他们在其中写了这个

index - Index of the focused route object in the routes array

所以我在expo snack上查看了他们的示例

并将重置功能更改为此

 <Button
    title="Reset navigation state"
    onPress={() =>
      navigation.dispatch(
        CommonActions.reset({
          index: 0,
          routes: [
            {
              name: 'Profile',
              params: { user: 'Cyberduck', key: route.params.key },
            },
            { name: 'Home' },
          ],
        })
      )
    }
  />

在上面我已将索引更改为 0 并将 params: { user: 更改为 'Cyberduck'。我希望当我单击它时，它会将名称从 jane 更改为 Cyber​​duck，但它会将我导航到 Home 屏幕，即使我的索引为 0 并且我的路线数组中的第一个对象是 Profile 屏幕。

如果我删除 { name: 'Home' }, 对象，那么它会将名称从 Jane 更改为 Cyber​​duck

有人可以解释一下 react-navigation 中的索引吗？

Answer 1

.reset() 方法重置您的路线，索引就像放置新路线的位置

如果你有数组，就像一个数组，那么你需要将你的项目放在特定的位置，所以你使用 arrayName[index] 所以在这里你使用 reset() 方法，它将用这个索引重置你的堆栈，并且只有一个路由该索引最重要的路线是删除前。您将路线放在 0 索引上，然后删除所有先前的堆栈，然后使用 0 重新创建堆栈。

如果您不想这样做，请使用 jumpTo()

忽略我的拼写和语法错误 希望这会有所帮助。