不能将类型“boolean”分配给类型“LocationQueryValueRaw | LocationQueryValueRaw[]

Question

项目背景：vue3 + ts项目

项目部分代码：

let bool = ref(false)
router.push({
  name: 'xxx',
  query: {
    isShow: bool.value, // 这里就是TS类型检测失败了
    // 目前，我的解决方案是：
    // isShow: JSON.stringify(bool.value)
  }
})

类型检测失败：

isShow下面红色波浪线，提示：不能将类型“boolean”分配给类型“LocationQueryValueRaw | LocationQueryValueRaw[]

提问：
这里是不能将布尔值传过去么？只能传参string类型？有没有不用修改数据类型的传参方式？

Answer 1

【以下回答由 GPT 生成】

我的回答:
这个问题产生的原因是因为Vue Router在处理query参数的时候会对不同类型的值做处理，而布尔类型并不是其支持的类型之一，因此在这里需要将布尔类型转换为字符串类型。具体解决方案如下：

```javascript
let bool = ref(false);
router.push({
  name: 'xxx',
  query: {
    isShow: bool.value.toString(), // 使用toString()方法将布尔类型转换为字符串类型
  }
})

通过使用toString()方法将布尔类型转换为字符串类型，就能解决这个问题了。希望对你有帮助！ ```

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^