push is not a function
первый раз работаю с js и vue для учебного проекта.
Возникла ошибка
Uncaught (in promise) TypeError: this.testcases.push is not a function.
Поискал похожие вопросы, в них говорилось о том, что не совпадают возвращаемые значения (Массив и объект). Но,к сожалению, не понял ответа и не смог исправить ошибку.
var testcaseApi = Vue.resource('/testcase{/id}')
Vue.component('testcase-form',{
props:['testcases'],
data:function() {
return {
author: '',
update_date: "2021-01-01",
creation_date: "2021-01-01",
case_name: '',
step: '',
input_data: '',
result: '',
chain_id: 0,
testplan_id: 0,
element_id: 0
}
},
template:
'<div>'+
'<input type="text" placeholder="Автор" v-model="author"/>'+
'<input type="datetime-local" placeholder="Дата изменения" v-model="update_date"/>'+
'<input type="datetime-local" placeholder="Дата создания" v-model="creation_date"/>'+
'<input type="text" placeholder="Название" v-model="case_name"/>'+
'<input type="text" placeholder="Шаг тестирования" v-model="step"/>'+
'<input type="text" placeholder="Входные данные" v-model="input_data"/>'+
'<input type="text" placeholder="Ожидаемый результат" v-model="result"/>'+
'<input type="text" placeholder="chain_id" v-model="chain_id"/>'+
'<input type="text" placeholder="testplan_id" v-model="testplan_id"/>'+
'<input type="text" placeholder="element_id" v-model="element_id"/>'+
'<input type="button" value="Save" @click="save"/>'+
'</div>',
methods:{
save:function (){
var testcase = {
author:this.author,
update_date: this.update_date,
creation_date: this.creation_date,
case_name: this.case_name,
step: this.step,
input_data: this.input_data,
result:this.result,
chain_id: this.chain_id,
testplan_id: this.testplan_id,
element_id: this.element_id
};
testcaseApi.save({},testcase).then(result =>
result.json().then(data=>{
this.testcases.push(data);
this.author = '';
this.update_date = "2021-01-01";
this.creation_date= "2021-01-01";
this.case_name = '';
this.step = '';
this.input_data = '';
this.result = '';
this.chain_id = 0;
this.testplan_id = 0;
this.element_id = 0;
})
)
}
}
})
Vue.component('testcases-list', {
props:['testcases'],
template:'<div>' +
'<testcase-form testcases="testcases"/>'+
'<testcase-row v-for="testcase in testcases" :key="testcase.id" :testcase="testcase" /></div>',
created: function (){
testcaseApi.get().then(result =>
result.json().then(data=>
data.forEach(testcase => this.testcases.push(testcase))
)
)
}
});
Ответы (1 шт):
Автор решения: Unkn
→ Ссылка
this.testcases - это объект, у объектов нет функции push. Для того, чтобы добавить элемент в объект используется конструкция либо this.testcases.newOption = '123', либо this.testcases['newOption'] = '123'. Если нужно "сложить" два объекта используется Object.assign(). Для наглядности посмотрите в документации.