JSFiddle - React, Tailwind, and code Playground

by rich_harris

HTML

<main>
  <p>twice {{foo}} is {{double(foo)}}</p>
  <button v-on:click="say('hi')">
  say hi
  </button>
</main>

Babel + JSX

var vm = new Vue({
	el: 'main',
  data: {
  	foo: 1,
    
    // comment these out
    double ( num ) {
      return `${num*2} (via data)`;
    },
    say ( msg ) {
      alert( `${msg} (via data)` );
    }
  },
  methods: {
		double ( num ) {
      return `${num*2} (via methods)`;
    },
    say ( msg ) {
      alert( `${msg} (via methods)` );
    }
	}
})