Vue + Typescript vue-router 和参数类型

Question

我正在尝试将一些数据从一个组件发送到另一个组件，但我遇到一些类型问题。这是我的代码：

const someData: object = {
   param1: 'param1',
   param2: 'param2',
   array: [{},{}]
}
this.$router.push({ name: 'SomePage', params: { someData } }) 

我这样获取数据：

  get param1 (): string {
    return this.$route.params.someData['param1']
  }
  get param2 (): string {
    return this.$route.params.someData['param2']
  }
  get array (): Array<object> {
    return this.$route.params.someData['array']
  }

以及来自控制台的错误：

Argument of type '{ name: string; params: { someData: object; }; }' is not assignable to parameter of type 'RawLocation'.
  Type '{ name: string; params: { someData: object; }; }' is not assignable to type 'Location'.
    Types of property 'params' are incompatible.
      Type '{ someData: object; }' is not assignable to type 'Dictionary<string>'.
        Property 'someData' is incompatible with index signature.
          Type 'object' is not assignable to type 'string'.

仅当我输入 type 时它才有效any，someData但我不会不使用它。我怎么解决这个问题？这是什么'Location'以及'RawLocation'类型？

Answer 1

您可以作为查询参数在页面中传递的是字符串类型，而不是其他任何类型。这意味着您无法通过查询参数发送数组。你应该将所有参数更改为字符串

   const someData: object = {
      param1: 'stringType',
      param2: 'stringType',
      ...
   }
   this.$router.push({ name: 'SomePage', params: { someData } })

您可以保存和数据类型并在您想要的任何地方使用它，而不是查询参数vux，在我的开头，我会更好，因为同时您可以自己管理传递的数据

关于你@MagnusTeekivi，你可以在使用它之后将其转换为字符串，就像这样

`this.$router.push({ name: 'user', params: { userId.toString() })`