Vue项目获取url中的参数(亲测可用)

以下是“Vue项目获取url中的参数(亲测可用)”的完整攻略：

1.使用window.location.search

我们可以通过window.location.search来获取当前页面URL中的查询参数（即以'?'开头的部分）。例如，如果当前页面URL是http://example.com?name=John&age=20，那么window.location.search将返回?name=John&age=20。我们可以再通过字符串截取的方式来获取想要的参数值。以下是示例代码：

//假设URL为http://example.com?name=John&age=20
const params = new URLSearchParams(window.location.search);
const name = params.get('name');
const age = params.get('age');

console.log(name); //'John'
console.log(age); //20

2.使用Vue Router的$route对象

如果你的Vue项目中使用了Vue Router，那么可以通过访问$route对象来获取URL中的参数。以下是示例代码：

//定义路由规则
const router = new VueRouter({
  routes: [{
    path: '/user/:id',
    component: User
  }]
});

//在User组件中获取参数
const User = {
  template: '<div>User id is: {{ $route.params.id }}</div>'
};

假设在浏览器中访问/user/123，那么将会显示：“User id is: 123”。

希望以上两条示例可以对你有所帮助。任何关于Vue项目的问题，都欢迎咨询！