如何链接到Shopify嵌入式应用程序中的另一个页面

Question

我正在为Shopify构建一个嵌入式React应用程序。

我正在尝试执行从一个页面导航到另一个页面的看似简单的任务。

例如，我想在index.js上显示一个链接，将用户带到newpage.js.

我尝试过使用Shopify的<Link>组件(请参阅https://polaris.shopify.com/components/navigation/link#navigation)。然而，当我点击页面时，我会看到以下错误：

Expected a valid shop query parameter

有什么想法吗？

Answer 1

默认情况下，Polaris的Link组件默认为<a>标签，该标签不属于react路由器范围。

您需要用react路由器Link覆盖Link组件。这是作为传递给AppProvider组件的道具来完成的。

import {BrowserRouter, Link as ReactRouterLink} from 'react-router-dom';
<AppProvider linkComponent={Link}>

关于此事的更多信息，请点击此处：https://polaris.shopify.com/components/structure/app-provider#section-使用链接组件