Question

我正在使用一个具有类别屏幕的应用程序，其中显示了该类别的相关帖子。我正在使用react-navigation在屏幕之间导航并处理深层链接。类别屏幕可以在应用程序内或通过深层链接访问。要通过深层链接访问类别屏幕，我正在使用类似myapp://category/:id的东西。

如果该应用已经打开并且专注于类别屏幕，则深层链接将不执行任何操作。

我目前已使用componentDidUpdate生命周期方法“修复”了它，以比较状态中存储的ID和navigation.getParam中的ID。

componentDidUpdate = () => {
  const { navigation } = this.props;
  const { categoryID } = this.state;
  const paramID = navigation.getParam('id', null);

  if (paramID !== categoryID) {
    this.setState({ categoryID: paramID }, () => {
      // fetch data
    });
  }
}

但是，这对我来说似乎是一个肮脏的解决方法。有更好的方法吗？也许使用推式而不是通过反应导航来打开所有深层链接？

Answer 1

对于那些想知道如何做到这一点的人，比如我，这里是解决方案：

您可以使用 getId Stack.Screen property。您只需要从 getId 属性返回唯一 ID。举个例子：

假设我们有一个 UserScreen 组件，它是我们的 Stack 导航器的一部分。 UserScreen 有一个路由参数：userId。我们可以像这样使用 getId 属性：

import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();

const AppStack = () => {
  const getUserRouteId = ({ params }) => {
    return params && params.userId;
  };

  return (
    <Stack.Navigator>
      {/* Other routes */}
      <Stack.Screen name="User" component={UserScreen} getId={getUserRouteId} />
    </Stack.Navigator>;
  );
};

现在，当您尝试使用 navigate 函数正常导航到此路线时，如果导航操作中的参数 userId 与您当前所在的 UserScreen 不同打开，它将导航到新的用户屏幕。 React Navigation deep linking 在内部使用 navigate 函数。

Answer 2

如果要从当前页面更新当前页面的值，则可以：

navigation.push（routeName，params，action）；

// categoryScreen.js
this.state={
   categoryID : this.props.navigation.state.params.id
}
this.props.navigation.push("category",{id: "john"})

深度链接到具有不同参数的已经打开的屏幕。可能吗？

2 个答案: