Я пытаюсь добавить новый html в свой div после нажатия кнопки, используя v-for
.
Но после того, как я нажму кнопку, я получаю эту ошибку, и элемент (статья) добавляется в div один раз, но после этого он больше не будет работать.
vue.js? 3de6: 1743 TypeError: Не удается прочитать свойство "_withTask" неопределенного
при удалении $ 2 (eval at (app.js: 561),: 7078: 13)
на updateListeners (eval at (app.js: 561),: 2067: 7)
в Array.updateDOMListeners(eval at (app.js: 561) ,: 7091: 3)
на patchVnode (eval at (app.js: 561),: 5918: 62)
at updateChildren (eval at (app.js: 561),: 5809: 9)
на patchVnode (eval at (app.js: 561),: 5923: 29)
at updateChildren (eval at (app.js: 561),: 5809: 9)
на patchVnode (eval at (app.js: 561),: 5923: 29)
at updateChildren (eval at (app.js: 561),: 5809: 9)
на patchVnode (eval at (app.js: 561),: 5923: 29)
HTML-код:
<article v-for="item in range">
<span>
{{item[0]}} - {{item[1]}}
</span>
<span>
<button class="btn btn-theme btn-default btn-xs pull-left" @click="deleteItem" ><i class="fa fa-times inline"></i></button>
</span>
</article>
JS:
data() {
return {
majornew:this.major,
certificate:this.cert,
range:[],
item:[],
};
},
methods: {
addmajorcert(majortext,certext) {
this.item = [majortext,certext];
this.range.push(this.item);
console.log(majortext,certext);
},
},
Обновлено: Есть два окна выбора, куда передаются значения
<v-select v-model="selectedmajor" label="major_text" id="major" name="majornew" :options="majornew" >
</v-select>
<v-select v-model="selectedcert" :options="certificate" label="lc_text" id="cert" v-on:click="certificate"></v-select>
<button v-on:click="addmajorcert(selectedmajor,selectedcert)">
+
</button>
В поле выбора возвращается объект, например:
{ "major_id": 2, "major_text": "industrial", "number_of_used": 1 }
Когда я делаю console.log
я могу видеть передаваемые значения.
вот моя попытка,
Скажи мне, есть ли что-то, чего ты не понимаешь, или если я что-то пропущу.
У меня была та же самая проблема, и это было, потому что я использую событие, но это не было определено в сценарии, вот примерная проблема:
<template>
<div>
<button @click="deleteItem"></button>
</div>
</template>
Итак, вы можете видеть, что я использую метод deleteItem
но в сценариях ниже метода методов у меня нет функции с таким именем. и это вызывает у меня ошибку _withTask. Я думаю, что это может кто-то еще.
<script>
export default {
methods: {
// No function with name deleteItem
}
}
</script>
<article v-for="item in range">
У вас есть диапазон и элемент, определенные в ваших данных, но вы перебираете диапазон и называете каждый элемент итерации. Не уверен, но это может быть проблематично, попробуйте изменить название своего элемента в своем v-для:
<article v-for="majorcert in range">
Кстати, я думаю, вам нужен v-ключ при использовании v-for, это может быть:
<article v-for="majorcert in range" :key="majorcert.major_id">