Vue Router Vue SPA களுக்கான அதிகாரப்பூर்வ ক্লায়েন్ট்-ஒரு வழிசெலுத்தி. இது URL களை கூறுகளுக்கு வரைபடம் செய்து அவற்றை முழு பக்க புதுப்பிப்பு இல்லாமல் மாற்றுகிறது, மற்றும் வழிசெலுத்தலுக்கு முன் தர্க்கத்தை (உதாரணமாக பயனாளர் சரிபார்ப்பு) இயக்குவதற்கான வழிசெலுத்தல் பாதுகாப்பு இயந்திரங்கள் வழங்குகிறது.
{ createRouter, createWebHistory } ;
routes = [
{ : , : },
{ : , : },
{ : , : (),
: { : } },
];
router = ({ : (), routes });
<template>
<RouterLink to="/users/42">Profile</RouterLink> <!-- declarative navigation -->
<RouterView /> <!-- where the matched component renders -->
</template>
<script setup>
import { useRoute, useRouter } from "vue-router";
const route = useRoute(); // read current route: route.params.id, route.query
const router = useRouter(); // navigate programmatically: router.push("/home")
</script>
// global guard — runs before EVERY navigation (great for auth)
router.beforeEach((to, from) => {
const authed = useAuthStore().isLoggedIn;
if (to.meta.requiresAuth && !authed) {
return "/login"; // redirect: return a path (or false to cancel)
}
// returning true / nothing → allow the navigation
});
பாதுகாப்பு இயந்திரங்கள் to (இலக்கு வழி) மற்றும் from (தற்போதைய) பெறுகின்றன, மற்றும் அனுமதி, ரத்து (false), அல்லது மறுவழிநடத்த (ஒரு இடத்தை திரும்பி) முடியும். meta.requiresAuth கொடி + ஒரு உலகளாவிய beforeEach என்பது நியதி பயனாளர் சரிபார்ப்பு கட்ட நடைமுறை.
Global: router.beforeEach / afterEach — every navigation (auth, analytics)
Per-route: beforeEnter in the route config — specific routes
In-component: onBeforeRouteLeave — e.g. "unsaved changes, leave?" prompts
{ path: "/settings", component: Settings, children: [
{ path: "profile", component: Profile }, // → /settings/profile, renders in nested <RouterView>
]}
மேலும்: வழி அளவுருக்கள், வினா சரங்கள், பெயரிடப்பட்ட வழிகள், தேய்தல் நடத்தை, மற்றும் குறிப்புரை-ஏற்றப்பட்ட வழி கூறுகள் குறிப்பு பிளவுக்கு.
Vue Router எந்த பல-பக்க Vue SPA க்கும் அপরிहार்य — இது ক্লায়েন்ট்-பக்க வழிசெலுத்தல் (வேகமாக, மீளமைப்பு இல்லை), गतिशील/உள்ளமைக்கப்பட்ட வழிகள், மற்றும் RouterLink/RouterView வழங்குகிறது।
வழிசெலுத்தல் பாதுகாப்பு இயந்திரங்கள் குறுக்கு-வெட்டு சிக்கல்களுக்கான முக்கிய பண்பு: பயனாளர் சரிபார்ப்பு மூலம் பாதுகாப்பு வழிகளை கட்டுப்படுத்தல், பக்க பார்வைகளை பதிவுசெய்தல், மற்றும் சேமிக்கப்படாத படிவங்களிலிருந்து விலகி செல்வதைத் தடுத்தல்.