JSFiddle - React, Tailwind, and code Playground

by Hiroki Osame

HTML

<script src="https://unpkg.com/vue@2.6.11/dist/vue.js"></script>
<script src="https://unpkg.com/vue-pseudo-window@0.1.4/dist/PseudoWindow.js"></script>
<div id="app">
  <pseudo-window @resize.passive="setWinDimensions">
    Window dimensions: {{ winWidth }} x {{ winHeight }}
  </pseudo-window>
</div>

JavaScript

new Vue({
  el: "#app",
  components: {
  	PseudoWindow,
  },
  data: {
    winWidth: window.innerWidth,
    winHeight: window.innerHeight,
  },
  methods: {
  	setWinDimensions(){
    	this.winWidth = window.innerWidth;
    	this.winHeight = window.innerHeight;
    }
  }
})