Used CSS: Course Vue.js

by Yure Pereira

HTML

<div id="app">
  <div class="box" v-bind:class="{'box-red': showClass}"></div>
  <div class="box"></div>
  <div class="box"></div>
</div>

CSS

#app {
  display: flex;
  justify-content: space-around;
}

.box {
  width: 100px;
  height: 100px;
  background: #ddd;
}

.box-red {
  background: #f00;
}

.box-green {
  background: #0f0;
}

.box-blue {
  background: #00f;
}

JavaScript

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