reinerBa / Vue-Responsive

A plugin for responsive handling with vue.js
https://reinerba.github.io/Vue-Responsive/dist/
MIT License
99 stars 6 forks source link

Bind class on breakpoint #3

Closed Fisik closed 2 years ago

Fisik commented 5 years ago

Can i bind different classes for div with your plugin?

For example i have:

And i need to change class_1 to class_3 on mobile layout.

reinerBa commented 5 years ago

Yes and i have an example for a feature like this https://reinerba.github.io/Vue-Responsive/dist/#demoSix

Just add "v-responsive.class" into an element and it will always have the correct class, consisting of the prefix of the choosen set of breakpoints and the current breakpoint. The default values are bs4-xs, bs4-sm, bs4-md, bs4-lg, bs4-xl. Therefore the breakpoint set Bootstrap 4 and a middle size screen will add the class "bs4-md".

Fisik commented 5 years ago

Thanks for an answer, tried, but can't get it working. For example, v-responsive.md - working on this page like a charm, but this is not working (class is not added at all):

<div v-responsive.class> <span>A responsive panel</span> </div>

Could you please advise what i'm doing wrong?

reinerBa commented 5 years ago

You need the source in the master branch. Thanks for the hint, i will update the npm package as soon as possible.