vuejs，this。$ route.query.page，然后键入＆＃x27; null＆＃x27;不能分配给类型＆＃x27; String＆＃x27;

发布于 2025-01-31 11:43:24 字数 506 浏览 0 评论 0原文

我一直在研究这个问题大约2个小时，没有可用。我已经搜索了Internet，尝试创建条件等。

因此，我在Vuejs组件中有一种方法，看起来像这样：

paginate() {
  const test = this.$route.query.page;
  console.log(test);
  this.currPage = parseInt(test);
}

最后一行的“测试”一词具有红色下划线，并且我收到一条错误消息：

const test：locationqueryvalue | locationQueryValue []
类型'LocationQueryValue的参数| LocationQueryValue []'不可分配给类型'String'的参数。
type'null'不能分配给类型'string'.vetur（2345）

我应该如何在不编辑打字稿配置文件的情况下求解打字稿错误？

原文

I have been working on this for about 2 hours now, no to avail. I have searched the Internet, tried creating a condition, etc.

So I have a method in a VueJS component that looks like this:

paginate() {
  const test = this.$route.query.page;
  console.log(test);
  this.currPage = parseInt(test);
}

The word "test" on the last line has a red underline and I get an error message saying this:

const test: LocationQueryValue | LocationQueryValue[]
Argument of type 'LocationQueryValue | LocationQueryValue[]' is not assignable to parameter of type 'string'.
Type 'null' is not assignable to type 'string'.Vetur(2345)

How should I solve the TypeScript error without editing the TypeScript configuration file?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

蓝眼睛不忧郁 2025-02-07 11:43:24

它的意思是测试可以是null。它的类型可能是字符串| null是联合类型。您需要测试它以消除null案例。

For example

paginate() {
  const test = this.$route.query.page;
  console.log(test);

  if (typeof test === 'string') {
    // `test` has type string here because of the predicate.
    this.currPage = parseInt(test);
  }
}

Playground Link

请注意，上面的解决方案虽然确实正确，但会更改原始代码的含义，而如果test> test不是字符串。

It means test can be null. Its type is likely string | null which is a union type. You need test it to eliminate the null case.

For example

paginate() {
  const test = this.$route.query.page;
  console.log(test);

  if (typeof test === 'string') {
    // `test` has type string here because of the predicate.
    this.currPage = parseInt(test);
  }
}

Playground Link

Please note that the above solution, while indeed proper, changes the meaning of the original code, leaving this.currPage unchanged if test is not a string.

回复收藏 0 原文

辞取 2025-02-07 11:43:24

不仅是您的变量test可以是null，还可以是String> String和/或null null 的数组代码>值。

这是最好的情况：

https://www.example.com /？pag = 3

，但从技术上讲也是如此：

，'123'，null，''] 。

您可以做的事情：

const test = this.$route.query.page
let testAsNumber = -1
if (!Array.isArray(test) && test !== null) {
  // "test" is a string.
  testAsNumber = parseInt(test)
} else {
  // "test" is either an array or null.
}
console.log('testAsNumber', testAsNumber)

引用VUE路由器文档。

It is not just that your variable test can be null, it could also be an array of string and/or null values.

This is the best case scenario:

https://www.example.com/?page=3

But this could technically also be the case:

https://www.example.com/?page=abc&page=123&page&page=

Now your variable would hold ['abc', '123', null, ''].

Something that you could do:

const test = this.$route.query.page
let testAsNumber = -1
if (!Array.isArray(test) && test !== null) {
  // "test" is a string.
  testAsNumber = parseInt(test)
} else {
  // "test" is either an array or null.
}
console.log('testAsNumber', testAsNumber)

Reference to the Vue Router docs.

回复收藏 0 原文

~没有更多了~