Skip to content

Instantly share code, notes, and snippets.

@CHUKK
Created Jun 5, 2018
Embed
What would you like to do?
BMI app
<h1>BMI</h1>
<div id="app" class="bmi">
<p><input type="number" v-model="height" placeholder="cm"></p>
<p><input type="number" v-model="weight" placeholder="kg"></p>
<div class="best-bmi">
<p>Your Best BMI</p>
<span v-if="!bmiCalc">0</span>
<span v-else>{{ bmiCalc }}</span>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script>
new Vue({
el: '#app',
data: {
height: '',
weight: '',
bestBmi: ''
},
computed: {
bmiCalc: function () {
m = this.height / 100;
answer = this.weight / Math.pow(m, 2);
return Math.round(answer * 10) / 10
}
}
})
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment