JSFiddle - React, Tailwind, and code Playground

by rightson

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-router/3.0.1/vue-router.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vuetify/1.0.13/vuetify.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/vuetify.min.css">
<div id="app">
  <v-app dark>
    <v-tabs fixed-tabs>
      <v-tab to="/foo">Foo</v-tab>
      <v-tab to="/bar">Bar</v-tab>
    </v-tabs>
    <router-view></router-view>
  </v-app>
</div>

JavaScript

const Foo = {
  template: '<div>Foo component!</div>'
};

const Bar = {
  template: '<div>Bar component!</div>'
};

const routes = [
  { path: '/foo', component: Foo },
  { path: '/bar', component: Bar },
  { path: '*', 	  redirect: 'foo' }
];

const router = new VueRouter({ routes });

new Vue({
  el: '#app',
  router,
});