【问题标题】:How to set min and max boundaries for a js variable?如何为 js 变量设置最小和最大边界?
【发布时间】:2016-01-05 03:13:32
【问题描述】:

我目前正在使用 vuejs 渲染分页。这是我的 algolia 数据。

我正在检查用户是否按下了上一个按钮/下一个按钮或直接输入(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();
        }

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

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

【问题讨论】:

  • if (page < MIN || page > MAX) throw new Error("That page does not exist!")
  • 取决于想要的行为...您是否希望它在结束时循环到开始?还是隐藏按钮?无论哪种方式都需要与某处可用的总数进行比较,而这并未在问题中显示

标签: javascript jquery json vue.js algolia


【解决方案1】:

创建类似于属性的方法:

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 
    }

} 

无论你在哪里调用 decrimentor (this.currentPage--),你都会调用 prevPage。这使您可以集中管理行为。例如,如果您决定希望它在最后一页上点击下一页时进行轮播,它将转到第一页,您可以在一个地方实现它。

【讨论】:

  • 谢谢我喜欢这种方法。非常干净地将所有杂乱的代码隐藏在其他函数中,并保持整个代码的可读性。感谢您花时间阅读我的问题!
猜你喜欢
  • 1970-01-01
  • 2010-09-29
  • 1970-01-01
  • 1970-01-01
  • 2014-12-22
  • 1970-01-01
  • 2018-05-30
  • 2019-02-25
  • 2012-07-01
相关资源
最近更新 更多