如何使用 VueJS 中的过滤器将普通字符串转换为大写字符串？

过滤器是 Vue 组件提供的一项功能，可让您将格式设置和转换应用于模板动态数据的任何部分。组件的过滤器属性是一个对象。单个过滤器是一个接受一个值并返回另一个值的函数。返回的值是实际打印在 Vue.js 模板中的值。要使用过滤器大写字符串，我们必须编写逻辑将常规字符串转换为全大写并将过滤器应用于所需的字符串。

示例 1：

文件名：index.html

HTML

    


    
 
     

       Name :{{ name | upperCased }}
    
 
 
     

       Details : {{ details | upperCased }}
    
 
    
    

文件名：app.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 typesetting, remaining\
                  essentially unchanged",
  },
 
  filters: {
    upperCased: function (data) {
      upper = [];
      data.split(" ").forEach((word) => {
        upper.push(word.toUpperCase());
      });
      return upper.join(" ");
    },
  },
});

输出：

使用过滤器大写字符串