<template>
<view>
<block v-for="(item, index) in list" :key="item">
<view>¥{{ item.price | getFinallPrice }}</view>
</block>
总价:¥{{ finalMoney | getFinallPrice }}
</view>
</template>
<script>
export default {
data() {
return {
list: [{ price: 12 }, { price: 13 }, { price: 14 }, { price: 15 }, { price: 16 }]
};
},
computed: {
finalMoney() {//实时监听总价变化,用于购物车中
let finalMoney = 0;
for (let item of this.list) {
finalMoney += item.price;
}
return finalMoney;
}
},
methods: {},
filters: {//过滤器做到共用
getFinallPrice(price) {
return price.toFixed(2);
}
}
};
</script>
vue filters和computed的用法 (uniapp项目)
最新推荐文章于 2023-08-24 20:32:04 发布