vue2.7.16组合式API的watch监听不倒$route的变化。

[qew4]

vue2.7.16组合式API的watch监听不倒$route的变化。我主要是想在query发生变化后重新赋值给常量。但是不生效。
watch(()=>$route.query,(val)=>{ console.log(val) filterId.value = val.id },{ deep:true, immediate:true })

$route的来路：
import {useRoute} from "@/utils"; const $route = useRoute();

utils中的useRoute:
export function useStore() { const { proxy } = getCurrentInstance() const store = proxy.$store return store }
请问有人碰到这个问题吗？

[Shyam-Chen]

<script lang="ts" setup>
import { watch } from 'vue';
import { useRoute } from 'vue-router';

const route = useRoute();

watch(
  () => route.query,
  (query) => {
    console.log(query);
  },
  { immediate: true },
);
</script>

[qew4]

我把vue-router 2.8.1升级到3.6.5，import { useRoute } from 'vue-router';依然不能导入，依然错误：TypeError: (0 , vue_router__WEBPACK_IMPORTED_MODULE_6__.useRoute) is not a function

[qew4]

我们的vue3项目确实是 import { useRoute } from 'vue-router';这么导入没问题的，但是这次的错误是vue2.7.16

[qew4]

我看vue-router 4.x是专门为vue3设计的，提供了useRoute和useRouter。而vue-router3是没有useRoute和useRouter的，所以vue2.7能用的vue-router3根本就无法支持组合式API。

[Shyam-Chen]

試試 @vue/compat

[gui117]

"vue-router": "^2.8.1",在我的项目中安装了。 import { useRoute } from 'vue-router';引入找不到 useRoute， 所以我 上面实现了export function useStore() { const { proxy } = getCurrentInstance() const store = proxy.$store return store }

请问是我的vue-router版本过低了吗？vue2.7.16应该使用哪个版本的vue-router才 能够正确import { useRoute } from 'vue-router';

See vuejs/vue-router#3889

[Alfred-Skyblue]

See #9512 (comment)

[18568803179]

你试试 import { useRoute } from 'vue-router/composables' 能不能解决

[18568803179]

你试试 import { useRoute } from 'vue-router/composables' 能不能解决