Vue-тегі v-show директивасы

Шартты көрсетудің тағы бір нұсқасы v-show директивасы болып табылады. Пайдалануы өте ұқсас:

<template>
	<p v-show="isAuth">
		+++
	</p>
</template>

Айырмашылығы мынада: v-show бар элемент әрқашан рендерленеді және DOM-да қалады, ал оның CSS қасиеті display ғана ауыстырылады.

v-if директивасы "нағыз" шартты рендерингті орындайды, себебі ол оқиға тыңдағыштары мен блок ішіндегі бала компоненттердің шарттың ауысуы кезінде дұрыс жойылып, қайта жасалатынына кепілдік береді.

v-if директивасы сондай-ақ жалқау: егер шарт бастапқы рендеринг кезінде жалған болса, онда ол ештеңе жасамайды - шартты блок шарт ақиқат болғанға дейін рендерленбейді.

Салыстыру үшін, v-show әлдеқайда қарапайым - элемент әрқашан рендерленеді, бастапқы күйіне қарамастан, тек CSS негізінде ауыстырылады.

Жалпы алғанда, v-if ауыстыру шығындары жоғары, ал v-show бастапқы рендеринг кезінде жоғары шығындарға ие. Сондықтан жиі ауыстырылатын болса, v-show қолданыңыз, ал егер шарт орындалу барысында өзгермеуі мүмкін болса, v-if таңдаңыз.

v-show директивасын template элементінде қолдануға болмайды және ол v-else-мен жұмыс істемейді.

Абзац және батырма берілген. Абзацтың батырманы басу арқылы көрініп-көрінбеуін жасаңыз.

v-show және v-if директиваларының айырмашылықтарын түсіндіріңіз.

v-show директивасын қашан, ал v-if директивасын қашан қолданған дұрыс екенін түсіндіріңіз.

v-show директивасының қандай шектеулері бар екенін түсіндіріңіз.