Как получить активную точку останова попутного ветра в JavaScript? - PullRequest
Новая
       59

Как получить активную точку останова попутного ветра в JavaScript?

0 голосов
/ 30 января 2020

Я строю попутный ветер с помощью файла конфигурации и включаю его в реактивный проект.

Я хотел бы получить значение активной точки останова в javascript / React. Как я могу добиться того же .?

 <div class="block  sm:hidden md:hidden lg:hidden xl:hidden">al</div>
  <div class="hidden sm:block  md:hidden lg:hidden xl:hidden">sm</div>
  <div class="hidden sm:hidden md:block  lg:hidden xl:hidden">md</div>
  <div class="hidden sm:hidden md:hidden lg:block  xl:hidden">lg</div>
  <div class="hidden sm:hidden md:hidden lg:hidden xl:block">xl</div>
</div>

Выше показана активная точка останова. но как я могу получить то же самое в js без включения любой из вышеупомянутой разметки .?

1 Ответ

1 голос
/ 30 января 2020

Из документов попутного ветра вы можете импортировать свою конфигурацию из модуля узла tailwindcss: 

import resolveConfig from 'tailwindcss/resolveConfig'
import tailwindConfig from './tailwind.config.js'

const fullConfig = resolveConfig(tailwindConfig)

fullConfig.theme.width[4]
// => '1rem'

fullConfig.theme.screens.md
// => '768px'

fullConfig.theme.boxShadow['2xl']
// => '0 25px 50px -12px rgba(0, 0, 0, 0.25)'

Как вы можете видеть выше, вы можете получить свои точки останова, ссылаясь на fullConfig.theme.{breakpoint}. Вы должны быть в состоянии сравнить это с вашей текущей шириной экрана, используя javascript.

Подробнее здесь .

...