# 房贷30年和100年谁更划算，写个vue实例告诉你

·  阅读 18209

### 效果展示

30年¥7,611.11¥5,867.53
50年¥6,500.00¥5,116.85
100年¥5,666.67¥4,848.22
1000年¥4,916.67¥4,833.33

### 页面编写

``````<div id="app">
<div id="op">
<h1>房贷计算器</h1>
<label>贷款金额:</label>
<input class="inputNum" type="number">
<label>万</label>
<br />
<label>贷款利率: </label>
<input class="inputNum" type="number">
<label>%</label>
<br />
<label>贷款方式: </label>
等额本金
<label></label>

等额本息
<br />
<label> 贷款年限: </label>
<input class="inputNum" type="number">
<label>年</label>
<br />
<br />
<button @click="getInterestInfo">计算利率</button>
<br />
<br />
</div>
</div>

### vue编写

``````var aAmount = this.amount * 10000
var aMonInterest = this.interest / 100 / 12
var aMonth = this.years * 12

``````console.log("等额本息")
// 计算方法

var fenzi = aAmount * aMonInterest * Math.pow((1+aMonInterest),aMonth)
var fenmu = Math.pow((1+aMonInterest),aMonth) - 1

var monRepayment = fenzi / fenmu
var sumRepayment = monRepayment * aMonth

console.log("月还款额: " , monRepayment.toFixed(2) , " 总还款额: " , sumRepayment.toFixed(2) , " 总利息: " , (sumRepayment - aAmount).toFixed(2))

``````console.log("等额本金")
// 计算方法
var firstAccrual = (aAmount * aMonInterest).toFixed(2)
var firstRepay =  ((aAmount / aMonth) + (aAmount * aMonInterest)).toFixed(2)
console.log("第一个月还款额: " , firstRepay)

var temp = aAmount
var sum = 0
for(let i=1;i<=aMonth;i++) {
sum = sum + (aAmount / aMonth) + (temp * aMonInterest)
temp = temp - (aAmount / aMonth)
}
console.log("总还款额: " , sum.toFixed(2) , "总利息: " , (sum-aAmount).toFixed(2))