Vue да ирги гуруҳларни яратиш

Гуруҳлар ичида биз олдин ишлаган асосий гуруҳ билан ўхшаш тузилишга эга. Яъни ҳар бир гуруҳ файлида script ва template теглари бўлади.

Мисол учун User номли гуруҳ яратайлик. Унинг кодини мос келувчи файлга жойлаштирамиз:

<script>
	export default {
		data() {
			return {
				
			}
		}
	}
</script>

data гуруҳи объектида баъзи маълумотларни жойлаштириш мумкин:

<script>
	export default {
		data() {
			return {
				name: 'john'
			}
		}
	}
</script>

Бу маълумотларни гуруҳнинг кўринишида чиқариш мумкин:

<template>
	{{ name }}
</template>

Энди яратилган гуруҳнимизни асосий гуруҳга улайлик. Бунинг учun аввал уни импорт киламиз:

<script>
	import User from './components/User.vue'
	
	export default {
		
	}
</script>

Унинг номини components созламасида ёзамиз:

<script>
	import User from './components/User.vue'
	
	export default {
		components: {
			User
		}
	}
</script>

Ота гуруҳнинг кўринишида фарзанд гуруҳнинг кўринишини чиқариш мумкин. Бунинг учун гуруҳ номига мос келувчи тег ёзиш керак. Буни бажарамиз:

<template>
	<User />
</template>

Employee гуруҳини яратинг. Уни асосий гуруҳга уланг.