Как в VueJs получить элемент списка v-for?

Question

[vism]

На очень старом проекте использую vue в связке с jquery.
При добавлении динамических элементов через v-for нужно биндить jquery только к элементам данного блока.
В моем примере datepicker биндится заново на всей странице, нужно к отрендеренному блоку.

addNewTemplate() {
    let newTemplate = this.bankingTemplates[this.selectedNewTemplate];
    newTemplate.entry_date = moment().format('DD.MM.YYYY');
    newTemplate.invoice_date = moment().format('DD.MM.YYYY');
    if (newTemplate) {
        this.rows.push(newTemplate);
    }
    this.$nextTick(function () {
        $(".datepicker").datepicker();
    });
},

Как я понимаю лучше каждый datepicker обернуть в компонентик.
Но хочу биндить только к данному новому блоку, для лучшего понимания vue.

Answer 1

[0xD34F]

Можно попробовать запоминать при добавлении индекс нового элемента и использовать его при создании datepicker'а. Как-то так.

Ну и конечно вы правы - лучше сделать компонент. Например, так.

Comments

[vism]

А можно как-то использовать :key который вроде чуть ли не обязателен для v-for?

[0xD34F]

Можно. Пусть в массиве хранятся объекты, один из свойств у которых будет id. Его и используйте в качестве значения для ключа.

[vism]

0xD34F, Я имел ввиду использовать key для обращения/поиска элемента.
То есть не

$(this.$refs.datepickers).find('.datepicker').eq(index)

а типо такого

$(this.$refs.datepickers).find('.datepicker').$key(index)

нигде не могу найти эту информацию.

[0xD34F]

Вы чего-то странного хотите, в этом я вам не помощник.

[vism]

0xD34F, Возможно.
Я бэкендщик.
Пока некоторые вещи в vue мне не понятны.