Live2d Test Env

过滤器用于渲染数据,比如保留小数(vue会将小数点后为0的数据统统转化为整数类型),比如将数据前加入货币符

过滤器分为全局和局部,这里讲局部

filters与methods,computed同级,且filter类型通常为函数类型

语法:   <h1>{{  原数据    |    过滤器名  }}</h1>   //  “  | ”  意为分隔符

通常用于在mustache语法或者:bind指令中

案例: 将遍历数据保留后两位并在数据前加$符号

data:

      bookPrice: [1, 2, 2, 3, 5, 9]

web:

 <h1 v-for='item in bookPrice'>{{item | getPrices }}</h1>
        <!-- item: 原数据,getNumbers 过滤器名,两者之间使用 “|”分隔开 -->

filters:

 getPrices(item) {
                    return '$' + item.toFixed(2)
                }

这样就完成了数据的二次渲染。

以上。

原文地址:https://www.cnblogs.com/hjk1124/p/12273528.html