JSFiddle - React, Tailwind, and code Playground

HTML

<div id="app">
  <modal v-model="show"></modal>
  <button @click="toggle">Toggle</button>
</div>

CSS

.modal {
  width: 500px;
  height: 300px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .2)
}

JavaScript

const modal = {
	template: `<div v-if="value" class="modal">
  						<button @click="close">x</button>
     			 </div>`,
  props: {
  	value: false
  },
  methods: {
  	close() {
    	this.$emit('input', false)
    }
  },
  watch:{
  	value: function(val) {
    	console.log(val)
    }
  }
}

new Vue({
	el: '#app',
  components: {
  	modal
  },
  data: {
  	show: false
  },
  methods: {
  	toggle() {
    console.log(123)
    	this.show = !this.show
    }
  }
})