Vue2 过滤器

最新推荐文章于 2024-05-27 09:53:40 发布

布织锁云

最新推荐文章于 2024-05-27 09:53:40 发布

阅读量122

点赞数

文章标签： vue.js

本文链接：https://blog.csdn.net/qq_52731478/article/details/131022317

版权

局部过滤器

    <div class="app">
        <h1>价格：{{price|priceFiler}}</h1>
    </div>

    <script>
        let vm =new Vue({
            el:'.app',
            data:{
                price:5999
            },
            filters:{
                priceFiler(value){
                    console.log(value);  // value===this.price
                    return '$'+value.toFixed(1)
                }
            }
        })

全局过滤器

<div class="app">
        <h1>价格：{{price|priceFiler}}</h1>
    </div>

    <script>
        // 全局过滤器
        Vue.filter('priceFiler',function(value){
            return '$'+value.toFixed(1)
        })

        let vm =new Vue({
            el:'.app',
            data:{
                price:5999
            }
        })
    </script>