Vue fremworkinde atributlar bilen işlemek

data-daky aýratynlyklaryň gymmatlyklaryny diňe teksta däl, eýsem tegleriniň atributlaryna hem goşup bolýar. Bu v-bind direktiwasy arkaly amala aşyrylýar.

Geliň, bu direktiwa kömegi bilen img teginiň src atributyna gymmat belleýälim. Islenilen gymmat aşakdaky aýratynlykda saklansyn:

App.vuedata() {
  return {
    attr: 'img.png',
  }
}

Indi aýratynlykdaky gymmatlygy src atributyna ýazylyş:

App.vue<template>
  <img v-bind:src="attr">
</template>

Adatça, ähliler v-bind-iň gysgaldylan görnüşini ulanýar. Bu görnüş atributyň adyndan öň diňe iki nokat goýmakdyr:

App.vue<template>
  <img :src="attr">
</template>

Задание 1

data-da tekst we baglanyşyk salgysy saklansyn:

App.vuedata() {
  return {
    text: 'page',
    href: 'page.html',
  }
}

Bu maglumatlary ulanyp, aşakdaky kody düzmeli:

html<a href="page.html">page</a>