1、filters过滤
前端在展示后端传递过来的数据时,往往不能直接显示出来,需要经过一些转换,比如后端有个字段是datetime格式的,到了前端会发现是一个很奇怪的字符串,这个时候,通常需要写一个函数来格式化一下,在vue中,我们可以使用filter来增加一个函数用于格式化输出;这里我们以输入人民币,自动转换为美元为需求。例子如下:
<div id="app">
<div v-once>今日美元兑换人民币的汇率为:{
{ rate }}</div>
<div>
<h3>我要换美元</h3>
<div>请输入金额(元):<input type="text" v-model="rmb" /></div>
<div>兑换为美元的金额:{
{ rmb | formatPrice(rate, 1) }}</div>
</div>
<div>
<h3>我要换人民币</h3>
<div>请输入金额(美元):<input type="text" v-model="dollar" /></div>
兑换为人民币的金额:<span v-html='$options.filters.formatPrice(dollar, rate, 0)'></span>
</div>
</div>