amis App组件设置动态路由页面，获取不到最新 url 参数问题

描述问题：

问题1：使用 App 多页应用组件，设置动态路由（/page/:id）详情页，从详情页1（/page/123)跳转至详情页2（/page/456），params.id未更新。问题2: 页面详情页获取不到query参数，刷新页面才能获取到。

截图或视频：

https://github.com/baidu/amis/assets/116187210/4a9a89a1-def2-44d4-b59e-2010050fd690

如何复现（请务必完整填写下面内容）：

你是如何使用 amis 的？ npm
amis 版本是什么？ amis/master 项目最新分支
粘贴有问题的完整 amis schema 代码：

examples/app/app.tsx文件

export default {
  type: 'app',
  brandName: 'APP 模式',
  api: '/api/mock2/sample',
  header: {
    type: 'tpl',
    inline: false,
    className: 'w-full',
    tpl: '<div class="flex justify-between"><div>顶部区域左侧</div><div>顶部区域右侧</div></div>'
  },
  pages: [
    {
      label: 'Home',
      url: '/',
      redirect: '/pageA'
    },
    {
      label: '示例',
      children: [
        {
          label: '页面A',
          url: 'pageA',
          schema: {
            type: 'page',
            title: '页面A',
            body: [
              {
                type: 'button',
                actionType: 'link',
                link: './pageA/1234?name=zhangsan',
                label: '跳转到详情页，/pageA/1234?name=zhangsan',
                level: 'primary'
              }
            ]
          },

          children: [
            {
              label: '页面A-1',
              url: '/pageA/:id',
              schema: {
                type: 'page',
                title: '页面详情',
                body: [
                  {
                    type: 'tpl',
                    className: 'text-red',
                    tpl: '<h1>页面url参数：id: ${params.id}  name: ${name || "未获取到"}</h1>'
                  },

                  {
                    type: 'button',
                    actionType: 'link',
                    link: './56789?name=lisi',
                    label: '刷新详情页，/pageA/56789?name=lisi ',
                    level: 'primary'
                  }
                ]
              }
            }
          ]
        }
      ]
    }
  ]
};

操作步骤
点击首页【跳转到详情页，/pageA/1234?name=zhangsan】按钮
跳转至详情页/pageA/1234,页面显示出params.id为 1234 ，但是没显示出query.name。
继续点击【刷新详情页，/pageA/56789?name=lisi 】按钮，url发生变化，但是没有获取到最新的params和query.

Jan 02 '24 10:01 findreamer

问题1：params没有更新的原因是，这里url发生变化，当发现匹配的是相同的页面时，直接就退出了，没有更新到params参数，这里能否提交一个PR处理一下。截屏2024-01-02 18 10 20

packages/amis-core/src/store/app.ts

问题2：query未获取到的原因是，App 组件的父组件高阶组件HocStoreFactory 在 componentDidUpdate生命周期中有更新 IRenderer.data 逻辑（更新query数据），react组件的 componentDidUpdate 执行顺序是子组件 > 父组件，也就是说 location发生变化时，App组件会先执行render函数，但是从store.PageData中获取到的数据仍未更新。

Jan 02 '24 10:01 findreamer

你好 @findreamer 。请教一下，我现在的情况和问题里的情况有点不一样。我使用的是单页应用。请问如何动态跳转到一个新页面，而这个新页面就想你在视频里面一样是显示在同一个内嵌页面里面呢？十分感谢。

<body>
    <div class="amiss" id="amisId"></div>
    <script type="text/javascript">
        (function () {
            let amis = amisRequire('amis/embed');
            let current_time = "{{ current_time }}";
            let amisInstance = amis.embed(
                '#amisId',
                {
                    "type": "page",
                    "title": "新页面",
                    "body": [
                        {
                            "type": 'button',
                            "actionType": 'link',
                            "link": "./simple.html/detail",
                            "label": 'jump to detail page',
                            "level": 'primary'
                        }
                    ]
                },
                { locale: "zh-CN" },
                { theme: "cxd" }
            );
        })();
    </script>
</body>

Jan 13 '24 15:01 cic1988

@cic1988 呃，你这个示例代码不是单页应用啊，只是应用了Page组件，单页应用应该使用App组件（amis官网-组件- App），可参考源码示例：https://github.com/baidu/amis/blob/master/examples/app/index-vite.html，

Jan 16 '24 13:01 findreamer