JSFiddle - React, Tailwind, and code Playground

by Bo Andersen

HTML

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

<div id="app">
  <h1>{{ getFullName1() }}</h1>
  <h1>{{ getFullName2(firstName, lastName) }}</h1>
  <h1>{{ getFullName3().name }}</h1>
</div>

JavaScript

new Vue({
	el: '#app',
  data: {
		firstName: 'Bo',
    lastName: 'Andersen'
  },
  methods: {
  	getFullName1: function() {
    	return this.firstName + ' ' + this.lastName;
    },
  	getFullName2: function(first, last) {
    	return first + ' ' + last;
    },
    getFullName3: function() {
    	return {
      	name: this.firstName + ' ' + this.lastName
      };
    }
  }
});