iOSで100vhが効かない問題で、楽な方法をNuxt.jsでやってみる - Qiita

iOS safariで100vhがうまくいかない時に、 window.innerHeightを取って各要素のstyle属性に一個一個付ける、 というのをやりがちでしたが、楽な方法が無いかと探すとカスタムプロパティが使えるそうなので、 その手順をNuxt.js版で書きます。 mixinを作る --whという名前でカスタムプロパティを定義する。 ロード時と、リサイズ時にwindow.innerHeightを取って--whに入れる。 export default { data: () => ({ style: { '--wh': '100vh' } }), mounted() { this.$nextTick(() => { this.getWindowSize() window.addEventListener('resize', this.getWindowSize) }) }, metho