使用 Vue 过滤器查找闰年和非闰年

Vue 是一个用于构建用户界面的渐进式框架。核心库仅专注于视图层，易于获取并与其他库集成。 Vue 还可以完美地结合现代工具和支持库来支持复杂的单页应用程序。

过滤器是 Vue 组件提供的一项功能，可让您将格式设置和转换应用于模板动态数据的任何部分。组件的过滤器属性是一个对象。单个过滤器是一个接受一个值并返回另一个值的函数。返回的值是实际打印在 Vue.js 模板中的值。

方法：过滤器逻辑将首先检查所需年份是否可被 100 整除。如果它可以整除，那么我们还必须用 400 来检查它的整除性。如果可以被两者整除，那么指定的年份是闰年。如果年份本身不能被 100 整除，那么我们只需要检查它是否能被 4 整除。如果能被整除，则该年份是闰年，否则，它不是闰年。

例子：

index.html

    
    


  
    GeeksforGeeks
  
    
        {{year1}} :  
          {{ year1 | leapyear }}
        
  
        {{year2}} : 
          {{ year2 | leapyear }}
        
  
        {{year3}} : 
           {{ year3 | leapyear }}
        
  
        {{year4}} : 
          {{ year4 | leapyear }}
        
  
        {{year5}} : 
          {{ year5 | leapyear }}
        
  
    
    

应用程序.js

const parent = new Vue({
  el: "#parent",
  data: {
    year1: 2004,
    year2: 1996,
    year3: 1900,
    year4: 2010,
    year5: 1960,
  },
  
  filters: {
    leapyear: function (year) {
      if (year % 100 === 0) {
        if (year % 400 === 0) {
          return "Leapyear";
        } else {
          return "Non-Leapyear";
        }
      } else {
        if (year % 4 === 0) {
          return "Leapyear";
        } else {
          return "Non-Leapyear";
        }
      }
    },
  },
});

输出：