CODEWITHSUNDEEP
reactjsswiper.js
Big boy
Big boy

Reputation: 1751

How to use variables to configure Swiper's breakpoints in React?

This code works:

<Swiper
breakpoings={{
    400: {
       // config
    }
}}

But this code does not work:

const sm = 400;
<Swiper
breakpoings={{
    sm: {
       // config
    }
}}

Why it's so? How can I use variables in Swiper's breakpoints in React?

Upvotes: 0

Views: 273

Answers (1)

User456
User456

Reputation: 1301

When you want to name object key by variable you need to wrap it in square brackets.

const sm = 400;
<Swiper
  breakpoints={{
    [sm]: {
       // config
    }
  }}

Upvotes: 1

Related Questions