Pruebas de vue.js

by Jorge Bustos Pereda

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <input type="button" value="+" @click="counter++"/>
  <input type="button" value="-" @click="counter--"/>
  <p>Counter: {{counter}}</p>
  <p>Size: {{size}}</p>
  <p>Any has value: {{anyHasValue}}</p>
  <hr>
  <p>Other counter: {{otherCounter}}</p>
  <input type="button" value="Other counter +" @click="otherCounter++"/>
</div>

JavaScript

new Vue({
	el: '#app',
	data: {
  	counter: 5,
    otherCounter: 0
  },
  computed: {
  	size: function() {
      console.log('size executing');
    	return this.counter > 5 ? 'BIG' : 'SMALL';
    },
    anyHasValue: function() {
    	return this.counter || this.otherCounter;
    }
  }
})