vue3 ts通过引用页面标签 ref a页面往b页面传值

如果您想通过引用页面标签的 `ref` 来实现在 a 页面往 b 页面传值的话，可以使用 `$refs` 属性来获取页面标签的引用。

具体实现步骤如下：

1. 在 a 页面中定义一个变量，用来存储要传递的值。然后将该变量传递给 b 页面。

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

export default defineComponent({
  setup() {
    const router = useRouter();
    const value = ref('hello world');
    const handleClick = () => {
      router.push({ path: '/b', query: { value: value.value } });
    };
    return { handleClick };
  },
});

2. 在 b 页面中，使用 `$refs` 属性来获取 a 页面中的页面标签，并从页面标签中获取要传递的值。

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

export default defineComponent({
  setup() {
    const router = useRouter();
    const value = ref('');
    const handleClick = () => {
      router.push({ path: '/b', query: { value: $refs.myDiv.innerText } });
    };
    return { handleClick };
  },
  mounted() {
    this.value = this.$route.query.value as string;
  },
});

3. 在 a 页面中使用 `ref` 属性引用该标签。

<template>
  <div ref="myDiv" @click="handleClick">点击我跳转到 B 页面</div>
</template>

<script>
import { defineComponent, ref } from 'vue';
import { useRouter } from 'vue-router';

export default defineComponent({
  setup() {
    const router = useRouter();
    const myDiv = ref(null);
    const handleClick = () => {
      router.push({ path: '/b', query: { value: myDiv.value.innerText } });
    };
    return { myDiv, handleClick };
  },
});
</script>

这样就完成了通过引用页面标签的 `ref` 实现在 a 页面往 b 页面传值的操作。需要注意的是，使用这种方式传递的值只适合传递简单的字符串或数字等数据。如果需要传递复杂的对象，可以使用 `JSON.stringify()` 方法将对象转换成字符串进行传递，然后在 b 页面中使用 `JSON.parse()` 方法将字符串转换成对象。