ambit-tsai / vue2-helpers Goto Github PK

This is on Vue 2.7.

When I add a guard with onBeforeRouteLeave (inside a composable), the specified guard function is registered and called as expected. If I however manage to leave the page (because the guard allowed it) and then enter the same route/component again, a new guard is registered but the previous one is also still active and called. I validated this by printing out calls to the guard, including an auto-generated id of a computed ref that is created within the component.

This is problematic in my case because the guard relies on a computed "canLeave" flag to prompt for user confirmation and that is never updated after the page was left, meaning if the page was left, reentered and then the user wants to leave again, they will always be prompted even if they didn't make any changes on the page they are currently on.

Repo

Live Demo

npm i -g pnpm
pnpm install
pnpm run dev

• Should See route.query: {} at first.
• Step 1: Click toQuery button. Should see route.query: { "a": "1" }.
• Step 2: Click useQuery2 button. Should see route.query: { "a": "2" }, but actually see route.query: { "a": "1" }.
• Step 3: Click useQuery1 button. Should see route.query: { "a": "1" }.

Why I see route.query: { "a": "1" } in Step 2? I did something wrong? Any suggestions? :D

• 一开始应该会看到 route.query: {}。
• 步骤 1：点击 toQuery 按钮。应该会看到 route.query: { "a": "1" }。
• 步骤 2：点击 useQuery2 按钮。应该会看到 route.query: { "a": "2" }，但实际上看到 route.query: { "a": "1" }。
• 步骤 3：点击 useQuery1 按钮。应该会看到 route.query: { "a": "1" }。

为什么我在步骤 2 会看到 route.query: { "a": "1" }？我写错哪里了吗？有什么建议吗？:D

Where is the source code of v1.1.7?

请问能提供1.1.7版本的源码吗，仓库目前似乎还是1.1.6的

In v1.2.0 the returntype of useRoute becomes any

Since Vue 2.7.0, the value returned by getCurrentInstance() function has always been null.

Please change import getCurrentInstance() function from vue.

import { getCurrentInstance } from '@vue/composition-api';

to

import { getCurrentInstance } from 'vue';

See vueuse/vueuse#902 (comment)

i use vue 2.7.13, in <script setup>， but useRouter() log undefined

<script setup>
import { useRouter } from 'vue2-helpers/vue-router'
const router = useRouter()
console.log('router', router) // router is undefined
</scirpt>

I tested out vue-helpers with Vue 2.7 Beta 5 and I found the router is undefined. I know it is just a beta release but they were asking devs to test out their apps with 2.7 and report bugs.

const router = useRouter()

For now I am using the following workaround with Vue 2.7 and <script setup>

<script>
let router;
</script>

<script setup>
import { useRouter } from 'vue2-helpers/vue-router';
router = useRouter();
</script>

I upgraded to the latest Vue 2.7.11 and I get the error:
Cannot read properties of undefined (reading '_router')

My current work around is to call useRouter on mounted in script setup to avoid the undefined error.

onMounted(() => {
 router = useRouter();
})

可以把 vue 从dependencies改到peerDependencies么。毕竟用这个插件的话，都会用本地的vue，因为插件本身dependencies带有vue，导致我这边使用的时候无法获取到正确的结果