chore(sfc-playground): fix autoresize

diff --git a/packages/sfc-playground/src/App.vue b/packages/sfc-playground/src/App.vue
index de4ba074e3bacc4e3d9271392e796ff011ed07fa..71f441e8424e38d4642be2c8926012e89f3d8da9 100644 (file)
--- a/packages/sfc-playground/src/App.vue
+++ b/packages/sfc-playground/src/App.vue
@@ -3,7 +3,11 @@ import Header from './Header.vue'
 import { Repl, ReplStore } from '@vue/repl'
 import { watchEffect } from 'vue'
 
-document.documentElement.style.setProperty('--vh', window.innerHeight + `px`)
+const setVH = () => {
+  document.documentElement.style.setProperty('--vh', window.innerHeight + `px`)
+}
+window.addEventListener('resize', setVH)
+setVH()
 
 const store = new ReplStore({
   serializedState: location.hash.slice(1),
@@ -18,7 +22,7 @@ watchEffect(() => history.replaceState({}, '', store.serialize()))
 
 <template>
   <Header :store="store" />
-  <Repl :store="store" :showCompileOutput="true" />
+  <Repl :store="store" :showCompileOutput="true" :autoResize="true" />
 </template>
 
 <style>