Question

希望标题有意义。

我的React应用程序登录页面由三个组件组成-标题，主要内容区域，然后是底部的产品列表。单击产品后，将在全屏视图中显示类别列表，作为产品的子项，并将产品名称附加到URL。

由于我使用的产品数量众多，因此我最初只显示切片阵列中的六种产品。单击按钮显示下一个或上六个产品，通过更改状态来更改切片值。当我访问最初的六个产品之一的网址，即myurl.com/prod1时，它成功路由。但是，如果我尝试访问第二批产品之一的URL，例如myurl.com/prod7，则它不会路由并将我留在登录页面。

处理这种结构的正确方法是什么？

非常感谢。

Answer 1

您可以在componentDidUpdate方法上将前一条路径的路径名与活动路径的路径名进行比较，并在URL中进行任何更改时获取数据。

例如；

"defaults": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "preserveSymlinks": true,
            "outputPath": "dist/ConsoleClient",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets",
              "src/web.config"
            ],

P.S：您应该从react-router-dom包中随Router hoc一起导入，以访问路由器道具。

最初未呈现组件时，如何通过React-Router 4中的URL访问组件？

1 个答案: