React Navigation v5：如何与 Branch.io 一起使用

Question

我们有一个使用 Branch.io 通用 links 的应用程序。遵循以下文档： https://help.branch.io/developers-hub/docs/react-native#read-deep-link

在 react-native 应用程序上，您设置订阅者以在 javascript 运行时接收深度和通用的 links。

使用此处的最新 react-navigation：https://reactnavigation.org/docs/deep-linking

React Navigation 希望原生处理深度 links。 React Navigation 似乎没有提供手动启动 link.

的好方法

如何同时使用这两项服务？采用深度 link 并将其分解为可路由的深度 link 证明具有挑战性。我们的应用程序有嵌套的路由器，重做从路径到屏幕和参数的转换是我不想做的事情。最近有没有人做过这个？谢谢

Answer 1

您可以使用 subscribe 选项将传入链接通知 React Navigation：

const linking = {
  // Custom susbcription to handle incoming links
  subscribe(listener) {
    branch.subscribe(({ error, params, uri }) => {
      if (error) {
        console.error('Error from Branch: ' + error);
        return;
      }

      if (params['+non_branch_link']) {
        const nonBranchUrl = params['+non_branch_link'];
        // Route non-Branch URL if appropriate.
        return;
      }

      if (!params['+clicked_branch_link']) {
        // Indicates initialization success and some other conditions.
        // No link was opened.
        return;
      }

      // A Branch link was opened
      const url = params.$canonical_url;

      listener(url);
    });

    return () => {
      // Clean up the event listeners
      branch.unsubscribe();
    };
  },
  // Options such as prefixes, screens config etc.
  // ...
};

文档：https://reactnavigation.org/docs/deep-linking/#third-party-integrations

React Navigation v5：如何与 Branch.io 一起使用

React Navigation v5: How to use with Branch.io

react-native

react-navigation

react-navigation-v5