Как реализовать режим темного/света в VUE3?

const isDark = useDark({
selector: 'body',
attribute: 'color-scheme',
valueDark: 'dark',
valueLight: 'light',
})
< /code>
Должен ли я создавать несколько объектов для каждого элемента HTML на моей странице? Это кажется еще более трудоемким, чем предыдущий вариант. И как я могу использовать [b]isDark

[/b] в моих детских компонентах? Затем я использую это значение в каждом элементе HTML каждого компонента, чтобы применить класс «темного» или «света». Тем не менее, этот подход занимает много времени, и я считаю, что должен быть лучший способ справиться с этим.

Подробнее здесь: https://stackoverflow.com/questions/765 ... de-in-vue3

1758720153

Anonymous

 Мне интересно, как добавить режим Dark/Light в мой проект Vue 3. Я знаю [b][code]useDark[/code] [/b] и [b][code]useToggle[/code] [/b] от '@vueuse/core', но я не уверен, как их реализовать в каждом компоненте моего приложения. 
[code]const isDark = useDark({
selector: 'body',
attribute: 'color-scheme',
valueDark: 'dark',
valueLight: 'light',
})
< /code>
Должен ли я создавать несколько объектов для каждого элемента HTML на моей странице? Это кажется еще более трудоемким, чем предыдущий вариант. И как я могу использовать [b]isDark[/code] [/b] в моих детских компонентах? Затем я использую это значение в каждом элементе HTML каждого компонента, чтобы применить класс «темного» или «света». Тем не менее, этот подход занимает много времени, и я считаю, что должен быть лучший способ справиться с этим.  

Подробнее здесь: [url]https://stackoverflow.com/questions/76579547/how-to-implement-dark-light-mode-in-vue3[/url]