Challenge 1 - Course Vue.js

by Yure Pereira

HTML

<div id="desafio">
  
  <!-- 1) -->
  <p>Usando VUE.js : {{ name }} ({{ age }})</p>
  
  <!-- 2) -->
  <p>{{ age * 3 }}</p>
  <p>{{ ageMultipliedBy3() }}</p>
  
  <!-- 3) -->
  <p>{{ random(1, 2) }}</p>
  
  <!-- 4) -->
  <div>
    <img v-bind:src="urlGoogle" height="400">
  </div>
  
  <!-- 5) -->
  <div>
    <input type="text" v-bind:value="name">
  </div>
  
</div>

JavaScript

new Vue({
	el: '#desafio',
  data: {
  	name: 'Yure Pereira',
    age: 25,
    urlGoogle: 'https://www.fullstackpython.com/img/logos/vuejs-wide.png',
  },
  methods: {
  	ageMultipliedBy3: function() {
    	return this.age * 3;
    }, 
  	random: function(min, max) {
    	return Math.floor((Math.random() * max) + min);
    }
  }
});