В настоящее время я занимаюсь разработкой виджета на основе React, который может быть встроен в любой веб-сайт.К сожалению, я не знаю, какую ширину будет иметь родительский контейнер-div виджета.
Таким образом, виджет может отображаться во всю ширину на 27-дюймовом экране в боковой панели шириной 200 пикселейна планшете или что-то еще.
К счастью, мне просто нужны две "точки останова" в моем виджете: lg & sm .
Теперь я вижудве задачи:
1) Обнаружение и хранение
Где я должен определить ширину виджета (даже если его размер был изменен) и где я должен хранить информацию отекущая ширина / точка останова? Должен ли я просто дать моему контейнеру-обертке виджета CSS-класс или хранить информацию в redux / helper-class / ...?
2) Какдля обработки CSS-классов с уникальными именами классов
Чтобы избежать конфликтов с другими классами на веб-сайте, я использую опцию localIdentName загрузчика css. Если я добавлю .app-lgк контейнеру упаковки, как я могу выбрать это имя класса в стилях любого компонента(из-за localIdentName)?
Спасибо!