方法一

import { watch, ref } from 'vue';
import { useRoute } from 'vue-router';

const route = useRoute();
const id = ref<string>();

watch(
    () => route.query,
    (val: any) => {
      id.value = val.id;
    },
);

方法二

import { watch, ref, unref } from 'vue';
import { useRouter } from 'vue-router';

const router = useRouter();

const id = ref<string>();

watch(
  () => unref(router.currentRoute).query,
  (val: string) => {
    id.value = val;
  },
);

方法三

import { computed } from 'vue';
import { useRoute } from 'vue-router';

const route = useRoute();

const id = computed(()=>route.query?.id)

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐