When the user search for a movie it gives them a list of movies grabbing data from OMDBAPI that matches the search term So when they click on the movie it takes them to another page that contains information about that movie. In this pages I have back button so when you click on that button it should take you to the last page where you left but in my case it takes you to the first page. for instance: if you click on the movie on third page and then press the back button on that page to go back to the third page instead it takes you to the first page.
My Search class where I make API call for the movie.
export default class Search {
constructor(query) {
this.query = query
}
async getResults(page = 1) {
const moviesList = [];
try {
while (page >= 1 && page <= 4) {
const res = await axios(`${proxy}http://www.omdbapi.com/?apikey=${apiKey}&s=${this.query}&type=movie&page=${page}`);
this.responseData = res.data.Response;
const response = res.data;
response.Search.forEach(movies => moviesList.push(movies));
page++;
this.result = moviesList;
this.page = page
}
} catch (error) {
console.log(error);
}
}
}
search Controller
const searchController = async(type, page) => {
if (type === 'newSearch') {
//1-GET SEARCH QUERY FROM SEARCHVIEW
const query = searchView.getInput();
if (query) {
//2-CREATE SEARCH OBJECT
state.search = new Search(query);
try {
//4-SEARCH FOR MOVIES
await state.search.getResults();
//5-RENDER the results on UI
searchView.renderResults(state.search.result);
} catch (error) {
console.log(error)
}
}
} else if (type === 'oldSearch') {
try {
//4-SEARCH FOR MOVIES passing current page
await state.search.getResults(page);
//5-RENDER the results on UI
searchView.renderResults(state.search.result);
} catch (error) {
console.log(error)
}
}
}
when I want to go back to the previous after clicking on a movie I invoke searchController and pass the current page to it and tell its old Search searchController('oldSearch', state.search.page);
but instead it takes me to the first page.
Any help or direction is appreciated.