vue2.X基础知识二之数据计算

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>