provide/inject ஒரு மூதாதையர் கூறு எந்த வம்சாவளி கூறுவிற்கு தரவு வழங்க அனுமதிக்கிறது, அது எவ்வளவு ஆழமாக இருந்தாலும், ஒவ்வொரு இடைநிலை கூறு வழியாக props அனுப்பாமல். அவை prop drilling தீர்க்கிறது.
App → Layout → Sidebar → Menu → MenuItem
எனில் MenuItem மட்டும் theme தேவை, அதை Layout, Sidebar மற்றும் Menu (இதை பயன்படுத்தாது) வழியாக prop ஆக அனுப்புவது சலிப்பும் சத்தமும். provide/inject நடுவை தவிர்க்கிறது.
<!-- App.vue -->
<script setup>
import { provide, ref } from "vue";
const theme = ref("dark");
provide("theme", theme); // make `theme` available to ALL descendants
provide("toggleTheme", () => { // can provide functions too
theme.value = theme.value === "dark" ? "light" : "dark";
});
</script>
<!-- MenuItem.vue (deeply nested) -->
<script setup>
import { inject } from "vue";
const theme = inject("theme"); // get it directly — no props in between
const toggleTheme = inject("toggleTheme");
const color = inject("color", "blue"); // with a default fallback
</script>
// ✅ provide a ref/reactive so descendants see updates
provide("theme", theme); // theme is a ref → reactive
// ❌ provide("theme", theme.value) → passes a snapshot, not reactive
வினைத்திறனான பொருளை வழங்கவும் (the ref, அதன் .value அல்ல) அது மாறும் போது, அனைத்து ஊசி செய்த கூறுகள் புதுப்பிக்கிறது.
import { themeKey } from "./keys"; // export const themeKey = Symbol()
provide(themeKey, theme); // avoids string-key collisions
provide/inject → pass data down a specific subtree (theme, form context, a service)
Pinia → global, app-wide shared state (user, cart) usable anywhere
provide/inject ஐ subtree க்குள் dependency-injection க்குப் பயன்படுத்தவும்; நிலை உண்மையாக உலகளாவிய அல்லது ஆப்பின் சம்பந்தமில்லாத பகுதிகளில் பகிரப்பட்டு இருந்தால் Pinia க்குப் போகவும்.
provide/inject பல உள்தொய்ந்த கூறுகளால் பகிரப்படும் தரவுக்கான prop drilling ஐ நீக்குகிறது (தீம்கள், மொழி, படிவ/சூழல், plugin சேவைகள்).
வினைத்திறனான மதிப்புகளை வழங்குவது பற்றி தெரிந்துகொள்ளுதல் (புதுப்பிப்புகள் பரவுகின்றன), default/குறியீட்டு விசைகளை பயன்படுத்துதல் மற்றும் இது உலகளாவிய நிலையிலிருந்து வேறுபடுத்துதல் (Pinia) ஆப்பின் ஆழ்ந்த கூறு மரங்கள் வழியாக பகிரப்பட்ட சூழலை சுத்தமாக அனுப்ப உங்களை அனுமதிக்கிறது.