zoukankan      html  css  js  c++  java
  • vue-filters(过滤器)

      局部过滤器:

    <html>
    
    <head>
        <title>vue</title>
        <meta charset="utf-8">
    </head>
    
    <body>
        <div id="app">
            {{msg | toFixed(1)}}
            <!-- msg是参数input的值,方法里的参数都是作为input后的参数 -->
        </div>
    </body>
    <script src="node_modulesvuedistvue.js"></script>
    <script>
        let vm = new Vue({
            el: "#app",
            filters: {
                // toFixed(input,param1,param2,param3)
                toFixed(input, num) { //第二个参数为小数点个数
                    return '' + input.toFixed(num);
                }
            },
            data:{
                msg:15.123
            }
        });
    </script>
    
    </html>

      全局过滤器(记得放在所有实例之前)

    <html>
    
    <head>
        <title>vue</title>
        <meta charset="utf-8">
    </head>
    
    <body>
        <div id="app">
            {{msg | my(2)}}
            <!-- msg是参数input的值,方法里的参数都是作为input后的参数 -->
        </div>
    </body>
    <script src="node_modulesvuedistvue.js"></script>
    <script>
        // 全局过滤
        // Vue.filter(name,function)
        Vue.filter('my',(input,num)=>{
            return '' + input.toFixed(num);
        })
        // 局部过滤
        let vm = new Vue({
            el: "#app",
            filters: {
                // toFixed(input,param1,param2,param3)
                toFixed(input, num) { //第二个参数为小数点个数
                    return '' + input.toFixed(num);
                }
            },
            data:{
                msg:15.123
            }
        });
    </script>
    
    </html>

  • 相关阅读:
    jQuery初级篇
    DOM初级篇
    CSS基础篇
    javascript 初级篇
    HTML 基础篇
    Oracle文章中常用数据表的描述
    Oracle视图基础
    Oracle序列简单应用
    Oracle关联查询关于left/right join的那点事
    赋值和算术运算符
  • 原文地址:https://www.cnblogs.com/angle-xiu/p/11410800.html
Copyright © 2011-2022 走看看