JSFiddle - React, Tailwind, and code Playground

by furiblog

HTML

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<div id="app">
  <p :class="{ 'text-color': activeFlg, 'bg-color': !activeFlg }">Hello World!</p>
  <button @click="activeFlg = !activeFlg">ボタン</button>
</div>

CSS

.text-color {
  color: red;
}

.bg-color {
  background-color: green;
}

JavaScript

new Vue({
  el: '#app',
  data: {
    activeFlg: true
  }
});