前端：带参数跳转

跳转一般使用代码router.push({name: '', query: { key: value }}); 或者 router.push({name: '', params: { key: value }});。
有query和params两种传参方式，
params只支持name，不支持path。
params 传参后，刷新页面会失去拿到的参数，所以路由配置中，路由参数要修改（要加上参数）为 '/login/:username'（官方称为动态路由）

chatgpt关于“param和query传参的区别”的回答：

在Web开发中，特别是在使用路由系统时，"param"和"query"是两个常用的概念，它们用于在URL中传递参数，但它们有着不同的使用方式和含义。

Param:

• Params（参数）是路由路径中的一部分，通常用于传递路由特定的信息。这些参数通常用于标识资源或页面的特定实例。
• 在URL中，参数通常作为路径的一部分，使用占位符来表示。
• 在Vue Router或React Router等前端路由器中，路由参数可以通过定义动态路径来实现。例如，在Vue Router中，动态路径参数使用冒号（:）表示，例如/user/:userId，其中:userId就是一个参数。
• 路由参数在路由定义中是必须的，且不能省略。例如，/user/:userId中的:userId是一个参数，路由会匹配任何/user/后面跟着的值，并将该值作为参数传递给相关组件。

Query:

• Query（查询）是通过URL的查询字符串传递的参数，用于向服务器请求特定资源或执行特定操作。
• 在URL中，查询参数通常跟在问号（?）后面，并以键值对的形式出现，多个参数之间使用&分隔。例如：?page=1&sort=asc。
• 查询参数对于过滤、排序、分页等操作非常有用，因为它们可以提供更灵活的方式来请求数据，而不是通过路径来传递固定的标识符或实例。
• 在前端路由中，查询参数可以通过路由对象的query属性访问，而不是作为路由定义的一部分。在Vue Router中，可以通过this.$route.query来访问查询参数。
• 总结来说，路由参数（param）通常用于标识资源或页面的特定实例，而查询参数（query）通常用于过滤、排序、分页等操作，提供更灵活的方式来请求数据。

经过params跳转之后的路径：

经过query跳转之后的路径（路径带有问号）：

两种传参方式，用 router.query.id 和 router.params.id 来获得参数。（const router = useRouter()）

    const url = router.resolve({name: 'problemdetail', params: { problem_id:row.id }}).href;  //  router.resolve()方法返回的是一个路由解析对象
    window.open(url);  //  打开新窗口跳转