如何设置js变量的最小和最大边界?

时间:2021-12-20 07:43:51

I am currently rendering a pagination with vuejs. This is for my algolia data.

我目前正在与vuejs进行分页。这是我的algolia数据。

I am checking if a user pressed on a previous button/next button or on a direct input(1,2,3, etc.)

我正在检查用户是否按下了上一个按钮/下一个按钮或直接输入(1,2,3等)

    setPage: function(page) {
            if(page === 'previous') {
                // go back one page
                this.currentPage--;
                this.helper.setCurrentPage(this.currentPage).search();
            } else if(page === 'next') {
                // go forward one page
                this.currentPage++;
                this.helper.setCurrentPage(this.currentPage).search();
            } else {
                // change the currentPage with direct select(no prev/next button)
                this.helper.setCurrentPage(page).search();
            }

            // update the currentPage
            this.currentPage = this.helper.getCurrentPage();
        }

This works fine but I only have 0 - 4 pages(pages starts at 0). How can I make sure my currentPage var does not go in the negatives or beyond the maximum amount of pages that I have?

这工作正常,但我只有0 - 4页(页面从0开始)。如何确保我的currentPage var不会出现负数或超出我拥有的最大页数?

I guess using another if statement could work but it feels a bit sloppy. I am learning javascript and vue.js as we speak so I am wondering if there is a better way.

我想使用另一个if语句可以工作,但感觉有点草率。我正在学习javascript和vue.js,所以我想知道是否有更好的方法。

1 个解决方案

#1


4  

Create methods that act like properties:

创建像属性一样的方法:

function nextPage(pageParam){
    if (page > MAX) {
        // Disable next btn enable prev btn
    } else { 
        // advance page 
    }
} 

function prevPage(pageParam){
    if (page =< 0 ) {
        // Disable prev btn enable next btn
    } else { 
        // go back a page 
    }

} 

Wherever you call the decrimentor (this.currentPage--) you would call prevPage. This allow you to manage the behavior centrally. If for example you decided that you wanted it to carousel when you hit next on the last page it would go to the first page you can make it happen in a single place.

无论你在哪里调用decrimentor(this.currentPage--),你都会调用prevPage。这允许您集中管理行为。例如,如果您在最后一页上点击下一步时确定要将其转到旋转木马,那么它将转到第一页,您可以在一个地方实现它。

#1


4  

Create methods that act like properties:

创建像属性一样的方法:

function nextPage(pageParam){
    if (page > MAX) {
        // Disable next btn enable prev btn
    } else { 
        // advance page 
    }
} 

function prevPage(pageParam){
    if (page =< 0 ) {
        // Disable prev btn enable next btn
    } else { 
        // go back a page 
    }

} 

Wherever you call the decrimentor (this.currentPage--) you would call prevPage. This allow you to manage the behavior centrally. If for example you decided that you wanted it to carousel when you hit next on the last page it would go to the first page you can make it happen in a single place.

无论你在哪里调用decrimentor(this.currentPage--),你都会调用prevPage。这允许您集中管理行为。例如,如果您在最后一页上点击下一步时确定要将其转到旋转木马,那么它将转到第一页,您可以在一个地方实现它。