JSFiddle - React, Tailwind, and code Playground

by leopoldthecuber

HTML

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

<div id="app">
  <div :key="Math.random()" @click="v" :tabindex="i.title === 'Tab 1' ? -1 : 0" v-for="(i, n) in editableTabs"></div>
</div>

CSS

div {
  height: 100px;
  width: 100px;
  border: solid 1px black;
}

JavaScript

var Main = {
    data() {
      return {
        editableTabs: [{
          title: 'Tab 1',
          name: '1',
          content: 'Tab 1 content'
        }, {
          title: 'Tab 2',
          name: '2',
          content: 'Tab 2 content'
        }]
      }
    },
    methods: {
      v() {
        this.editableTabs = [{}]
      }
    }
  }
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')