美文网首页
Vue 遍历集合的时候,怎么在html页面执行函数

Vue 遍历集合的时候,怎么在html页面执行函数

作者: 一个冬季 | 来源:发表于2018-06-27 17:23 被阅读710次

今天我遇到一个问题,就是我在遍历集合的时候,后台把数据封装到对象里面,数字那些都在对象里面,我需要自己处理小数点的问题,问题是我要怎么在遍历的时候,处理小数点呢?
问题由来:比如我要像如下的方式来执行自己的函数,KilobitMoneyFormat这个是计算4舍5入的一个方法来着,如果我就这样写会报错

<div v-for="(item , index) in list " :key="index">
            <span class="nameMoneyFlag_item__toDayMon textWhileColor ">
                 {{ KilobitMoneyFormat(item.todayBalance) }}
        </span>
</div>

改正方法:采用过滤器来做

<div v-for="(item , index) in list " :key="index">
            <span class="nameMoneyFlag_item__toDayMon textWhileColor ">
                 {{ item.todayBalance | KilobitMoneyFormat }}
        </span>
</div>

js代码

 vm= new Vue({
        el: '#container',
        data:{
            nameMoneyFlag_item__flag:'nameMoneyFlag_item__flag',
        },
        filters:{//如下这样写
            KilobitMoneyFormat:function (valueNum) {//valueNum就是我们需要的值
                return KilobitMoneyFormat(valueNum);//返回给前台页面的值
            }
        }
    })

相关文章

  • Vue 遍历集合的时候,怎么在html页面执行函数

    今天我遇到一个问题,就是我在遍历集合的时候,后台把数据封装到对象里面,数字那些都在对象里面,我需要自己处理小数点的...

  • underscore.js中的集合函数

    集合函数 each(list, iteratee, [context]):遍历集合,并逐个执行函数,类似于原生的f...

  • Vue render 以及createElement 解析

    Vue中的template 里面使用的模版是HTML语法组件的页面,在Vue中都会被编译成render函数,Vue...

  • Vue - 渲染函数render

    一、render函数是什么 简单的说,在vue中我们使用模板HTML语法来组建页面的,使用render函数我们可以...

  • 14-Vue的render函数

    一、render函数是什么 简单的说,在vue中我们使用模板HTML语法来组建页面的,使用render函数我们可以...

  • Vue - 渲染函数render

    一、render函数是什么 简单的说,在vue中我们使用模板HTML语法来组建页面的,使用render函数我们可以...

  • render函数

    render 函数的作用 简单的说,在vue中使用模板HTML语法组建页面,使用render函数可以用js语言来构...

  • Swift 函数学习笔记

    sorted 排序函数 map遍历集合元素 filter过滤集合 reduce 遍历集合,计算元素 reverse...

  • Generator

    Generator generator函数执行后不执行函数体,返回遍历器对象,调用遍历器对象next()执行函数体...

  • vue学习:生命周期函数

    生命周期函数就是vue实例在某一个时间点会自动执行的函数1.beforeCreate:在vue初始化时候执行,在c...

网友评论

      本文标题:Vue 遍历集合的时候,怎么在html页面执行函数

      本文链接:https://www.haomeiwen.com/subject/czkiyftx.html