первый элемент в массиве не обновляется - PullRequest
0 голосов
/ 07 февраля 2019

Я хочу использовать изображения почти как флажки, и у меня это работает, но первый выбранный элемент не добавляет к нему класс

<div v-for="tenant in shops" :key="tenant.id">
  <div class="" style="position: relative;">
    <label :for="tenant.id+'-input'">
      <img @click="clickShop(tenant.id)"
           :id="tenant.id"  
           :src="tenant.img_url"
           class="tenant-img"
           :class="(isShopSelected(tenant.id))?'selected':''"
           style="height: 100px; width: 150px; margin: 10px;"/>
      <div :id="tenant.id+'-icon'" style="color: green; " 
           class="bottom-right fa fa-check-circle"></div>
    </label>
  </div>
</div>

И бит сценария

export default {
  props: ['form_id'],
  data() {
    return {
      shops: [],
      selected_shops: [],
      categories: [],
      selected: ''
    }
  },
  methods: {
    clickShop(id) {
      let choosen = document.getElementById(id + "-img");
      let icon = document.getElementById(id + "-icon");
      let input = document.getElementById(id + "-input");

      console.log('id is:' + this.selected_shops.indexOf(id));

      // check is in array and remove if it is
      if (this.selected_shops.indexOf(id) >= 0) {
        console.log('removed was:' + this.selected_shops.indexOf(id));

        this.selected_shops.splice(this.selected_shops.indexOf(id), 1);
      } else {
        this.selected_shops.push(id);
      }

      console.log(this.selected_shops);
      // remove shop if 
    },

    isShopSelected(id) {
      // console.log(this.selected_shops);
      let result = this.selected_shops.indexOf(id) > 0;

      if(result) {
        console.log(id);
      }
      // console.log('is shop selected' + id + ' ' + result);
      return result;
    }
  }
}

1 Ответ

0 голосов
/ 07 февраля 2019

Первый выбранный элемент будет иметь индекс 0, поэтому эта проверка не будет работать:

let result = this.selected_shops.indexOf(id) > 0;

Это должно быть >= 0.

...