Vue 3 बनाम Vue 2 के अंतर
Vue 3 Composition API, faster rendering, और Vue 2 से कई breaking changes लाया।
In this page:
Vue 3 बनाम Vue 2 Differences
Vue 3 new Vue की बजाय createApp इस्तेमाल करता है, multiple root nodes support करता है, event bus methods की जगह लेता है, destroy hooks का नाम बदलकर unmount करता है, modelValue के साथ v-model इस्तेमाल करता है, और Teleport, Suspense, और Composition API introduce करता है।
यह TypeScript में एक Proxy-based reactivity system के साथ फिर से लिखा गया है।
Note:
Vue 2 December 2023 में end of life पर पहुँच गया।
उदाहरण: Vue 3 vs Vue 2 differences
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
</head>
<body>
<div id="app">
<p>Vue 3 API: createApp is a {{ createAppType }}, major version {{ major }}</p>
<fragment-demo></fragment-demo>
</div>
<script>
const app = Vue.createApp({ data() { return { createAppType: typeof Vue.createApp, major: Vue.version.split(".")[0] }; } });
// Vue 3 components may have several root nodes (fragments)
app.component("fragment-demo", { template: "<h4>Root one</h4><h4>Root two</h4>" });
app.mount("#app");
</script>
</body>
</html>
<!-- Output:
Rendered: Vue 3 API: createApp is a function, major version 3Root oneRoot two
-->Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the
view already swaps in the hi_ translation fields (or blanks these
out if untranslated), so this renders correctly for both languages
without a lang_code check here. #}
आम गलतियां
- Vue 3 में new Vue इस्तेमाल करना
- $on और $off इस्तेमाल करना
- Vue 2 के filters feature इस्तेमाल करना
चैप्टर सारांश
- createApp new Vue की जगह लेता है
- Multiple root elements allowed हैं
- Hooks का नाम बदलकर unmount हुआ
- Composition API, Teleport, Suspense जैसी नई चीज़ें आईं
🔒
Chapter Quiz — Complete all 6 topics to unlock
0/6 topics done
Complete these topics first: