Я пытаюсь собрать книги на полке. Однако, когда я пытаюсь добавить книгу, страница ничего не делает, и я получаю эту ошибку в консоли "Uncaught (in prom) TypeError: Cannot read property 'pu sh' of undefined" . Нужна помощь с этим.
main. js
function sendRequest(url,method,data) {
var r = axios({
method: method,
url: url,
data: data,
xsrfCookieName: 'csrftoken',
xsrfHeaderName: 'X-CSRFToken',
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
})
return r
}
var app = new Vue({
el : '#app',
data: {
book: '',
books: [
{title: 'one'},
{title: 'two'}
]
},
created(){
var vm = this;
var r = sendRequest('','get')
.then(function(response){
vm.books = response.data.books;
})
},
methods: {
createBook(){
var vm = this;
var formData = new FormData();
formData.append('title', this.book);
sendRequest('','post',formData)
.then(function (response) {
vm.books.push(response.data.book); //PROBLEM HERE
vm.book = '';
})
}
}
})
views.py
def add_book(request, shelf_id):
context = {}
if request.POST:
shelf = get_object_or_404(Shelf, pk=shelf_id)
book_form = BookCreation(request.POST)
temp = book_form.save(commit=False)
temp.shelf = shelf
temp.save()
if book_form.is_valid():
books = book_form.save()
return JsonResponse({'book': model_to_dict(books)},status=200)
return render(request, 'shelf/addBook.html')
url.py
path('<int:shelf_id>/create_book', add_book, name='addbook'),