我正在使用 TMDB API ( https://developers.themoviedb.org/3/movies ) 創建一個電影網站,我想在主頁中顯示 20 部電影,然后在單擊“下一步”時顯示另外 20 部電影。這是我的 Home.vue<template> <div class="home"> <MovieList v-bind:movies="movies" :showMovies="showMovies"/> <div class="my-4"> <!-- Pagination --> <ul class="pagination pagination-md justify-content-center text-center"> <li class="page-item" :class="page === 1 ? 'disabled' : ''"> <a class="page-link" @click="prevPage">Previous</a> </li> <li class="page-link" style="background-color: inherit"> 1 </li> <li class="page-item" :class="page === lastPage ? 'disabled' : ''"> <a class="page-link" @click="nextPage">Next</a> </li> </ul> </div> </div></template><script>// @ is an alias to /srcimport MovieList from '../components/MovieList'import axios from 'axios'export default { components: { MovieList }, data: function() { return { movies : null, page: 1, loading: false, perPage: 20 } }, methods: { getData() { var that = this axios.get('https://api.themoviedb.org/3/movie/now_playing?api_key=e7bb075c43180bc41bffe6004eb81113&language=en-US&page=' + this.page) .then(function(response) { that.movies = response.data.results }) }, prevPage () { this.page-- }, nextPage () { this.page++ }, lastPage () { let length = this.movies.length return length / this.perPage } }, mounted: function () { this.getData() }}</script>我猜我的 getData() 函數有問題,但我似乎無法解決它。有人知道我做錯了什么嗎?太感謝了!
Vue:無法通過 API 進行分頁
慕森王
2023-09-21 16:32:26