This function is triggered on button click
nextPage() {
this.tweets = []
this.$route.query.page = 1
this.getTweets()
},
What it's doing is resetting array of tweets to zero, incrementing existing query(page) by 1 and calling getTweets function
getTweets(newCurrent) {
this.tweets = []
const API_URL = `${this.$server}/api/twitter/tweets`
const params = {
token: getUserToken(),
// THIS IS WHERE I AM PASSING QUERY
page: this.$route.query.page,
newCurrentPage: newCurrent,
}
axios.post(API_URL, null, { params }).then(res => {
this.currentPage = res.data.page
this.numberOfPages = res.data.numberOfPages
res.data.tweets.forEach(tweet => {
const tweetData = {
id: tweet.id,
tweet_text: tweet.tweet_text,
twitter_name: tweet.twitter_name,
twitter_username: tweet.twitter_username,
added_at: moment(String(tweet.added_at)).format('MM/DD/YYYY hh:mm'),
}
this.tweets.push(tweetData)
})
})
}
And then finally in nodejs. Here I am getting typeof number but currentPage is still concatenated, if I were on page 20 and I click next, currentPage will be 201. How to avoid this?
var currentPage = parseInt(req.query.page)
console.log(typeof currentPage)
console.log(currentPage)
// check if there is newCurrentPage
if(newCurrentPage != undefined) {
skip = (newCurrentPage - 1) * pageSize
currentPage = newCurrentPage
} else {
// check if page is valid
if(currentPage < 1) {
currentPage = 1
} else if(currentPage > numberOfPages) {
currentPage = numberOfPages - 1
}
// offset
skip = (currentPage - 1) * pageSize
}
CodePudding user response:
Query parameters in vue-router are always treated as string
. Because it can be page=1
like it could be page=foo
, there is no way to know.
So ?page=1
will be this.$route.query.page === "1"
To fix this, you'll have to parse the parameter first:
const newPage = parseInt(this.$route.query.page, 10) 1
Side note, assigning a new value to $router.query.page
doesn't work. You have to push a new route for it to update:
const newPage = parseInt(this.$route.query.page, 10) 1
this.$router.push({ query: newPage })