当尝试使用nextjs的新应用路由器的拦截路由功能来将其与Modal一起使用时，Modal永远不会被渲染，只有url发生变化。
我的项目结构看起来像这样：

*/app
*@modal
*（.）用户
*[ID]

• page.js
  *用户名
  *[id]
• page.js
• page.js

根page.js包含一个链接到/user/someUUID的组件。当点击该链接时，只有URL发生变化，模式永远不会被渲染。
我使用了这个示例代码作为参考：https://github.com/vercel-labs/nextgram
它工作得很好。我使用了与示例中完全相同的模态组件。
我的/@modal/（.）user/[id]/page.js：

'use client'

import Modal from "../../../../components/modal"

export default function UserModal({ params: { id: userId } }) {
    alert("in modal page")

    return (
        <Modal>
            <p>{userId}</p>
        </Modal>
    )
}

My /user/[id]/page.js：

'use client'

export default function UserPage({ params }) {

    return (
        <p>{params.id}</p>
    )
}

Modal页面中的警报永远不会触发，但页面会被编译。我没有收到任何警告或错误或任何东西。有人知道我错过了什么吗？