Size: a a a

2020 April 06

IF

Infant Frontender in Svelte [svelt]
qwrt to
В svelte нельзя компоненту прописать класс <Component class="foo bar" /> ?
Нет.

Если нужно именно навесить класс, то можно так:
1. https://svelte.dev/repl/51ed74cf9317467d917b38e9283aa7de?version=3.20.1
2. https://svelte.dev/repl/df1cc65db2554498874769f26b6e557e?version=3.20.1
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
qwrt to
<div class="component-class foo bar">...</div>
а что такое div ?
источник

qt

qwrt to in Svelte [svelt]
рутовый элемент внутри компонента
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
qwrt to
рутовый элемент внутри компонента
а почему он там должен быть? 🤔
источник

qt

qwrt to in Svelte [svelt]
так понимаю 2 работает только если стили внутри компонента
источник

T

Th0r in Svelte [svelt]
qwrt to
рутовый элемент внутри компонента
их может быть 0, может быть 100
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
qwrt to
так понимаю 2 работает только если стили внутри компонента
можно создать проперти и прокинуть в него любые глобальные класс, а потом навесить его туда, куда надо
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
либо можно относительно безопасно заинжектить классы с помощью псевдо-глобального селектора (распространятся на поддерево)
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
либо CSS переменные
источник

qt

qwrt to in Svelte [svelt]
Странновато)
источник

T

Th0r in Svelte [svelt]
qwrt to
Странновато)
да ничего странного, просто у тебя нету рутового элемента, а компоненты по умолчанию инкапсулируют стили
есть рфц на эту тему, в нем есть раздел как решить задачу текущими средствами alternatives do-nothing
https://github.com/sveltejs/rfcs/blob/style-properties/text/0000-style-properties.md
источник

qt

qwrt to in Svelte [svelt]
Ясно, обидно конечно во vue это работает отлично, очень часто нужно менять поведение компонента относительно родителя. И вот чет сидеть пробрасывать проп className или врапать в другие дивы эт не очень прикольно.
источник

AY

Andrey Yamanov in Svelte [svelt]
qwrt to
Ясно, обидно конечно во vue это работает отлично, очень часто нужно менять поведение компонента относительно родителя. И вот чет сидеть пробрасывать проп className или врапать в другие дивы эт не очень прикольно.
https://svelte.dev/tutorial/context-api ? иожно менять поведение компонента относительно любого родителя. Или не оно?
источник

qt

qwrt to in Svelte [svelt]
У меня глобальные стили с утилитарными классами аля d-block, компонент по умолчанию инлайновый, но в некоторых ситуациях должен быть блоком.
источник

AY

Andrey Yamanov in Svelte [svelt]
qwrt to
У меня глобальные стили с утилитарными классами аля d-block, компонент по умолчанию инлайновый, но в некоторых ситуациях должен быть блоком.
Ну если это от родителя зависит, то просто меняешь у него контекст и подписываешься у ребёнка, меняешь как нужно стили. Или через CSS Custom Properties, что вероятно в данном случае будет в 10 раз проще.
источник

T

Th0r in Svelte [svelt]
qwrt to
У меня глобальные стили с утилитарными классами аля d-block, компонент по умолчанию инлайновый, но в некоторых ситуациях должен быть блоком.
так если у тебя где-то нужно добавить класс и класс глобальный, то просто пробрось class и добавь в компоненте где надо
https://svelte.dev/repl/1f80a26243db4572bfa08139158a5cef?version=3.20.1
источник

qt

qwrt to in Svelte [svelt]
так и сделал, но все равно лишние движения
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
qwrt to
Ясно, обидно конечно во vue это работает отлично, очень часто нужно менять поведение компонента относительно родителя. И вот чет сидеть пробрасывать проп className или врапать в другие дивы эт не очень прикольно.
зато во Vue есть обязательный рут-элемент, что тоже странновато часто бывает)
источник

qt

qwrt to in Svelte [svelt]
Согласен
источник

PM

Pavel 🦇 Malyshev in Svelte [svelt]
ну и в целом такой подход попахивает bad practice. считаю что разработчику должно прикладывать лишние усилия, чтобы нарушить инкапсуляцию компонентов. в этом случае у него формируется правильное понимание, что в этом месте он что-то делает не совсем верно и это скорее костыль
источник