A Vue.js Directive For Responsivity – Vue-Responsive

Install & Download:

npm install vue-responsive

Description:

Vue-Responsive is a Vue directive to use responsive breakpoints on HTML elements.

How to use it:

1. Import and register the vue-responsive.

import responsive from 'vue-responsive'
Vue.use(responsive);

2. Show & hide elements using the v-responsive directive.

<div v-responsive.lg.xl>Visible on desktop</div>
<div v-responsive.md>Visible on tablet</div>
<div v-responsive.sm.xs >Visible on mobile</div>

Preview:

Vue-Responsive

Changelog:

v1.3.0 (01/23/2022)

  • Update

Add Comment