Vue.js 通过指向vue组件的URL处理数据

我有一封电子邮件，里面有一些密码更改的加密数据。我想打开一个URL，将此数据作为查询参数，如下所示：

<button onclick="window.location.href='http://127.0.0.1:8080/changePW?c1=${username.iv}&c2= $ {username.content}'">

props: {
  c1: {
    type: String,
    default: '',
  },
  c2: {
    type: String,
    default: '',
  }
}

我会在公共页面中使用名称还是使用带有查询参数的路径

const publicPages = ['/', '/privacy', '/privacyGen', '/changePW']

---

但是那不行。

我想你要找的是路线

参数

{
  path: '/changePW?c1=val1&c2=val2',
  name: 'changePW',
  component: changePassw
  props: (route) => {
    c1: route.query.c1,
    c2: route.query.c2,
  }
}

然后在您的
changePassw
组件中，您可以将这两个组件作为
道具
如下所示：

<button onclick="window.location.href='http://127.0.0.1:8080/changePW?c1=${username.iv}&c2= $ {username.content}'">

props: {
  c1: {
    type: String,
    default: '',
  },
  c2: {
    type: String,
    default: '',
  }
}

作为一个完整的注释，我认为更新命名约定为<代码> C1 < /代码>和<代码> C2 < /代码>对下一个开发人员来说可能毫无意义，对于您的组件名称，您已经拼出了代码“CuxEpasW”，为什么不添加额外的3个字母以使其更完整，如<代码> CuxEpasWord < /Calp>？p> 谢谢你的回答。虽然它给了我一个关于道具的语法错误。此外，我无法从我的电子邮件按钮打开链接。那里的语法正确吗？另外，当我直接在浏览器中打开url时
http://localhost:8080/?c1=test&c2=test1
我在我的主页上被重定向。@为什么你要用该URL中的查询字符串参数打开主页，而不是
/changePW
路径。我写的东西会给你什么语法错误？我现在在没有道具的情况下试过了。只需使用查询参数和正常路径
'/changePW'
和组件
中的this.$route.query这似乎也起作用。但是道具并没有让人难过。我更新了一点答案——我想我的语法错了，因为我只是在打字。尝试将道具设置为
route.query.c1
，然后它们应该作为道具工作（只要您的组件设置为接收它们），但我不需要路径：'/changePW？c1=val1&c2=val2'
？我的意思是，如果我只是将它用作路径：'/changePW'

，它似乎也能工作。