时间戳

首页 > 解决方案 > 单击 material-ui 表中的一行并重定向到另一个页面

javascript - 单击 material-ui 表中的一行并重定向到另一个页面

问题描述

我有一个名为 route-names.js 的文件，其条目如下

    export const REVIEW_FORM_URL = '/custom-forms/:customFormId';

我有一个包含几行的 material-ui 表，当我单击一行时，该行的 id 可以被视为 url 的一部分，它会将我带到一个空白屏幕。

     onClick(form) {
        this.props.history.push(REVIEW_FORM_URL.replace(':customFormId', form.customFormId));

      }

我需要构建一个新页面，该页面将使用该 url 中的值。

在上面的 onClick 代码中，我可以在哪里重定向到新页面？如何？

我的新页面的名称是 tester.js。

标签： javascriptreactjsmaterial-ui

解决方案

由于您使用的是this.props.history我假设您使用的是 React Router 的某个版本。

如果您想在应用程序中转到另一条路线，则使用history.push是其中一种可能性。

如果你在你的历史中推送一些东西，你应该有一个像这样的元素：

<Route path="/theRouteIWantToGoTo/:customFormId" render={<ComponentTester />}

由于您的 tester.js 渲染方法，在您的代码中的某处<ComponentTester />呈现您需要的内容。

你能分享更多你的代码吗？

推荐阅读