vue-resize


Detect DOM element resizing

JSFiddle

Sponsors


Installation

``
npm install --save vue-resize
`

Module import

⚠️ You need to include the package CSS:

`js
import 'vue-resize/dist/vue-resize.css'
`

Then import the package and install it into Vue:

`javascript
import Vue from 'vue'
import VueResize from 'vue-resize'

Vue.use(VueResize)
`

Or:

`javascript
import Vue from 'vue'
import { ResizeObserver } from 'vue-resize'

Vue.component('resize-observer', ResizeObserver)
`

Browser

`html




`

The plugin should be auto-installed. If not, you can install it manually:

`javascript
Vue.use(VueResize)
`

Or:

`javascript
Vue.component('resize-observer', VueResize.ResizeObserver)
`

Usage

Add the inside a DOM element and make its position to something other than 'static' (for example 'relative'), so that the observer can fill it.

Listen to the notify event that is fired when the above DOM element is resized.

Example

`html



``

---

License

MIT