Vue හි v-show නියෝගය

තත්වානුකූල ප්‍රදර්ශනය සඳහා තවත් විකල්පයක් වන්නේ v-show නියෝගයයි. භාවිතය ඉතා සමාන ය:

html<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 සමඟ ය.

Задание 1

යම් ඡේදයක් සහ බොත්තමක් ලබා දී ඇත. ඡේදය මාරු වන පරිදි සකසන්න බොත්තම ක්ලික් කිරීමෙන්.

Задание 2

පවසන්න, නියෝග අතර වෙනස්කම් මොනවාද v-show සහ v-if.

Задание 3

පවසන්න, හොඳම භාවිතා කරන්නේ කවදාද v-show නියෝගය, සහ කවදාද - v-if.

Задание 4

පවසන්න, කුමන සීමාවන් v-show නියෝගයට ඇති.