vue代码的一处问题

Question

setup() {
    const store = useStore()
    const userMenu = computed(() => store.state.login.userMenu)
    const router = useRouter()

    const route = useRoute()
    const menu = pathMapToMenu(userMenu.value, route.path)
    const defaultValue = ref(menu.id + '')

    const handleMenuClick = (item: any) => {
      router.push({
        path: item.url ?? '/not-found'
      })
    }
    return { userMenu, handleMenuClick, defaultValue }
  }

const route = useRoute()
const menu = pathMapToMenu(userMenu.value, route.path)
const defaultValue = ref(menu.id + '')  这一段的问题

<el-menu
      :default-active="defaultValue"
      class="el-menu-vertical"
      background-color="#0c2135"
      text-color="#b7bdc3"
      active-text-color="#0a60bd"
      :collapse="collapse"
    >

为什么点击导航触发路由的时候 defaultValue 的值会一直变化，setup应该只会执行开始的一次