Как получить HTML-children?

Question

[Андрей]

let c = document.getElementById("fls").children;
      console.log(c);
      console.log(c[0]);

Что я делаю не так? Почему с[0] undefined, a с.lenght равна 0

Comments

[dollar]

Что-то вы делаете не так.
И при чём здесь VUE? У вас код на чистом JS.

Answer 1

[Андрей]

Не успевал объект создаться, так все заработало

listInputFiles(val) {
      setTimeout(() => {
        let c = document.getElementById("fls").children;
        for (let i = 0; i < val.length; i++) {
          let st = val[i].status;
          switch (st) {
            case "add":
              c[i].classList.add("add");
              break;
            case "raw":
              c[i].classList.add("raw");
              break;
          }
        }
      }, 0);
    }

Answer 2

[shmatuan]

https://codepen.io/shmatkoandrey/pen/LgqOxm
Странно, так всё работает
Можно больше кода?

Comments

[Андрей]

Пожалуйста

<b-col>
              <b-form-group>
                <b-form-checkbox v-model="allSelected" :indeterminate="indeterminate" aria-describedby="listInputFiles" aria-controls="listInputFiles" @change="toggleAll" :title="allSelected ? 'Снять всё' : 'Выбрать всё'">
                </b-form-checkbox>
                <b-form-checkbox-group id="fls" class="border p-1 mnh-100"  stacked v-model="selected" :options=listInputFiles name="fls" aria-label="Individual files">
                </b-form-checkbox-group>
              </b-form-group>
            </b-col>

watch: {
      ...
      listInputFiles(val) {
        let c = document.getElementById("fls").children;
        console.log(c);
        console.log(c[0]);
      }
    }

[Андрей]

В вашем примере:
HTMLCollection(4)

у меня из под Vue HTMLCollection(0)
хотя она содержит те элементы которые там должны быть, что видно на моём скриншоте