如何使用 Vue.js 中的过滤器将文本更改为小写字符串？

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

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

要使用过滤器小写字符串，我们必须编写逻辑将常规字符串转换为全部小写并将过滤器应用于所需的字符串。

示例 1：

index.html

  

    
    
  
    

  

    
  
        
            Name :  
            {{ name | lowerCased }}
        
  
  
        
            Details :  
            {{ details | lowerCased }}
        
    

  

应用程序.js：

Javascript

const parent = new Vue({
    el : '#parent',
    data : {
        name : "Rinkle ROY",
        details: "Simply duMMy TEXT OF THE PRINTING
            and tyPesETTing industry.\
            Lorem Ipsum has BEEN the industry'S 
            Standard DUMMY text EVER sINCE the 1500s,\
            when An UNknown pRInter took a gAllery 
            of type and scrambled it to make a type\
            specimen book. It has suRVIVed not 
            oNLy five centurIES, but also the leAP into \
            electronic tyPestting, remaINIng 
            eSSEntially unchanGED"
    },
  
    filters:{
        lowerCased : function(data){
            lower = []
            data.split(' ').forEach(word => {
                lower.push(word.toLowerCase())
            })
            return lower.join(' ')
        }
    }
})

输出 ：

使用过滤器的下套字符串