patrickkunka
MixItUp with Nuxt Js
Hi!
Install npm i -S mixitup
1 - Create js file in plugins folder ( plugins/Mixitup.client.js )
import Vue from 'vue' import mixitup from 'mixitup'
Object.defineProperty(Vue.prototype, 'mixitup', { value: mixitup })
2 - Add to nuxt.config.js
plugins: [ { src: '~/plugins/Mixitup.client.js', mode: 'client' } ],
3 - Use in component
// HTML
// SCRIPT data () { return { mixer: null // Declare in data to avoid eslint warning } }, mounted () { this.$nextTick(() => { const containerEl = document.querySelector('.container') this.mixer = new this.mixitup(containerEl, { // Options animation: { Some options ... clampHeight: false // Use this if use flexbox or css grid to get a smooth filter or sort transition } }) }) }
// Css It's up to you
Dear Sir, What do you mean by multifilter plugin? Best regards,
Marcela Gómez Customer Service Representative
[International Electrotechnical Commission]http://www.iec.ch/
IEC - International Electrotechnical Commission | 3 rue de Varembé | PO Box 131 | CH-1211 Geneva 20 | Switzerland | T +41 22 919 0211 | e-tech magazinehttp://iecetech.org/ | websitehttp://www.iec.ch/ | webstore https://webstore.iec.ch/
From: sailtask @.> Sent: Thursday, 2. September 2021 08:53 To: patrickkunka/mixitup @.> Cc: Subscribed @.***> Subject: Re: [patrickkunka/mixitup] MixItUp with Nuxt Js (#513)
How can I use the multifilter plugin? (Assuming I already had a license in place)
You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHubhttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fpatrickkunka%2Fmixitup%2Fissues%2F513%23issuecomment-911278618&data=04%7C01%7Csales%40iec.ch%7Cd0839d7b23444805a84408d96dde5c63%7Ca7637f093d864148997bedcd40bee856%7C0%7C0%7C637661624072973663%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=ftD8nBb4A%2BZTJJ0Hgu12HYbVU2zqQ7dm8zgFn2Ffuxg%3D&reserved=0, or unsubscribehttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FABMNT4RH7APJ2YATC72J4OTT74NOHANCNFSM4ICEWGHA&data=04%7C01%7Csales%40iec.ch%7Cd0839d7b23444805a84408d96dde5c63%7Ca7637f093d864148997bedcd40bee856%7C0%7C0%7C637661624072983631%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=riehXjzsU%2BRiDNnHaDlO6F8rR2VSqgekbezd3x3TN%2Bk%3D&reserved=0. Triage notifications on the go with GitHub Mobile for iOShttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapps.apple.com%2Fapp%2Fapple-store%2Fid1477376905%3Fct%3Dnotification-email%26mt%3D8%26pt%3D524675&data=04%7C01%7Csales%40iec.ch%7Cd0839d7b23444805a84408d96dde5c63%7Ca7637f093d864148997bedcd40bee856%7C0%7C0%7C637661624072983631%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=9N2HFvrlOKaaQbs879gZnJWTE%2FpxIAcCzsO483DsBs4%3D&reserved=0 or Androidhttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fplay.google.com%2Fstore%2Fapps%2Fdetails%3Fid%3Dcom.github.android%26referrer%3Dutm_campaign%253Dnotification-email%2526utm_medium%253Demail%2526utm_source%253Dgithub&data=04%7C01%7Csales%40iec.ch%7Cd0839d7b23444805a84408d96dde5c63%7Ca7637f093d864148997bedcd40bee856%7C0%7C0%7C637661624072993586%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C1000&sdata=gxG6TYa7k5jwCLJAE1GbTs0AvU84JqvsziOY7BriuuA%3D&reserved=0.
