Vue-da checkbox bilen işlemek

Indi bolsa, checkbox bilen işlemişin nähili ýol berilýändigine serediň. Bizde şeýle bir açyp-ýapyjy bolsun:

App.vue<template>
  <input type="checkbox">
</template>

Bu checkbox-y dolandyrmak üçin checked aýratynlygyny ýasaýaly:

javascriptdata() {
  return {
    checked: true,
  }
}

Bu aýratynlygy v-model arkaly baglalyň:

App.vue<template>
  <input type="checkbox" v-model="checked">
</template>

Eger checkbox bellense, checked aýratynlygy true bahany alyar, eger bellinmese, false. Muny anyklamak üçin, aýratynlygyň bahasyny ekrana şeýle çykaryp bilersiňiz:

App.vue<template>
  <input type="checkbox" v-model="checked">
  <p>{{ checked }}</p>
</template>

Ternary operator ýardamynda has manyly bir zat çykaryp bolýar:

App.vue<template>
  <input type="checkbox" v-model="checked">
  <p>{{ checked ? 'hawa' : 'ýok' }}</p>
</template>
Задание 1

checkbox berlen. Abzas berlen. v-if direktiwasy ýardamynda şunu ýerine ýetiriň: eger checkbox bellenen bolsa, abzas görkezilmeli, eger bellinmese, gizlenmeli.