refactor(ProductList): 使用 `watch` 替代 `onBeforeRouteUpdate` 监听路由变化

为了简化代码逻辑,将 `onBeforeRouteUpdate` 替换为 `watch` 监听路由路径变化。这样可以直接在路径变化时触发数据刷新,减少不必要的回调处理。
This commit is contained in:
dzq 2025-04-18 17:14:57 +08:00
parent 746db18c59
commit 91edf31223
1 changed files with 5 additions and 5 deletions

View File

@ -8,8 +8,10 @@ import VanPopup from "vant/es/popup"
import { computed, onBeforeUnmount, onMounted, ref } from "vue" import { computed, onBeforeUnmount, onMounted, ref } from "vue"
import Cart from "./components/cart.vue" import Cart from "./components/cart.vue"
import Detail from "./components/detail.vue" import Detail from "./components/detail.vue"
import { onBeforeRouteUpdate } from 'vue-router' import { useRoute } from 'vue-router'
const router = useRouter()
const route = useRoute()
// //
const productStore = useProductStore() const productStore = useProductStore()
const cartStore = useCartStore() const cartStore = useCartStore()
@ -115,18 +117,16 @@ onBeforeUnmount(() => {
}) })
// //
const router = useRouter()
function handleCheckout() { function handleCheckout() {
router.push("/product/checkout") router.push("/product/checkout")
} }
// //
onBeforeRouteUpdate((to, from, next) => { watch(() => route.path, (newPath) => {
if (to.name == 'ProductList') { if (newPath === '/') {
productStore.getGoods() productStore.getGoods()
} }
next()
}) })
</script> </script>