JSFiddle - React, Tailwind, and code Playground

by budiadiono

HTML

<div id="app">

</div>

JavaScript

new Vue({
  template: 
  `<div>
    <input type="text" v-model="message">
    <button v-on:click="clear">Clear</button>
    <div>{{status}}</div>
  </div>`,
  data: function() {
    return {
      message: 'Hello!'
    }
  },
  computed: {
    status: function() {
      return this.message.length < 15 ? 'Too short... type some more...' : 'Alright, stop typing now..'
    }
  },
  methods: {
    clear: function() {
      this.message = ''
    }
  }
}).$mount('#app')