Vue'до бир багыттуу маалымат агымы

Бардык кириш параметрлер багып алуучу касиет менен ата-энесинин ортосундагы бир тараптуу байланышты түзөт: ата-энесинин касиети жаңыртылганда, ал багып алуучуга өткөрүлөт, бирок тескерисинче эмес. Бул багып алуучу компоненттердин ата-эне абалын кокустуктан өзгөртүүсүн алдын алат, бул сиздин колдонмоңуздун маалымат агымын түшүнүүн кыйындатпашы мүмкүн.

Мындан тышкары, ар жолу ата-эне компоненти жаңыртылганда, багып алуучу компоненттин бардык кириш параметрлери актуалдуу маанилер менен жаңыртылат. Бул сиз багып алуучу компоненттин ичиндеги кириш параметрин өзгөртүүгө аракет кылбашыңыз керек дегенди билдирет. Эгер сиз муну жасасаңыз, Vue консолго эскертүү көрсөтөт.

Адатта, кириш параметрин өзгөртүү искени пайда болгон эки учур кездешет. Келгиле, аларды карап көрөлү.

Биринчи учур

Кириш параметри баштапкы маанини берүү үчүн колдонулат; багып алуучу компонент аны кийинчерээк жергиликтүү маалымат касиети катары колдонгусу келет. Бул учурда эң жакшысы - маалыматтарда кириш параметринин маанисин баштапкы катары колдонгон жергиликтүү касиетти аныктоо:

props: ['initialCounter'],
data() {
	return {
		counter: this.initialCounter
	};
}

Экинчи учур

Кириш параметри иштетилбеген маани катары өткөрүлөт, аны кайра иштеп чыгуу керек. Бул учурда эң жакшысы - кириш параметрин колдонуп эсептелүүчү касиетти аныктоо:

props: ['size'],
computed: {
	normalizedSize: function() {
		return this.size.trim().toLowerCase();
	}
}

Эскертүү

Эсиңизде болсун, JavaScript'теги объектилер жана массивдер шилтеме боюнча өткөрүлөт, ошондуктан эгер кириш параметри массив же объект болсо, анда багып алуучу компоненттин ичиндеги бул объект же массивдин өзгөрүүлөрү ата-энесинин абалына таасир этет жана Vue муну эскертүүгө жөндөмдүү эмес. Кириш параметрлерин мутациялоодон, анын ичинде объектилер жана массивдерди мутациялоодон сак болуу керек, анткени маалыматтын бир тараптуу байланышын эске албоу каалаган эмес натыйжаларга алып келиши мүмкүн.