1. vue-resize-sensor
detect container resizing
vue-resize-sensor
Package: vue-resize-sensor
Created by: FranckFreiburger
Last modified: Tue, 28 Jun 2022 20:12:56 GMT
Version: 2.0.0
License: MIT
Downloads: 142,739
Repository: https://github.com/FranckFreiburger/vue-resize-sensor

Install

npm install vue-resize-sensor
yarn add vue-resize-sensor

vue-resize-sensor

detect container resizing.

  • event based
  • no window.onresize
  • no interval/timeout detection
  • no CSS modifications
  • no Javascript-Framework dependency

Example

<template>
  <div>
    <resize-sensor @resize="resize"></resize-sensor>
  </div>
</template>

API

props

initial Boolean

Request an initial size event.

events

@resize Object

A size object { width, height }

Browser support

Same browser support as Vue.js 2

Note

since v2.x, the script is exported as esm.

Credits

Franck Freiburger

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin