У меня есть проект Next.js. Я сделаю React-loader-spinner с использованием анимации. Но цвет анимации не работает. Я добавил встроенный стиль и собственный класс, но он по-прежнему использует значение по умолчанию. Как я могу это решить?
Я хочу изменить изменение цвета компонента.
<RotatingLines
visible = {true}
height = "36"
width = "36"
color = "gray"
strokeWidth = "5"
animationDuration = "0.75"
ariaLabel = "rotating-lines-loading"
wrapperStyle = {{}}
wrapperClass = ""
style = {{ stroke: '#fff' }}
className = "text-white stroke-white"
/>
@jarivak Если вы спрашиваете о пакете, который я использовал, я использовал этот. ссылка Если вы спрашиваете как код React, вот как его использовать: import { RotatingLines } из "react-loader-spinner"
Чтобы изменить цвет компонента <RotatingLines />
, вам необходимо добавить свойство strokeColor
.
Посмотреть рабочий предварительный просмотр можно здесь — https://codesandbox.io/p/sandbox/react-spinner-2gf9jl?file=%2Fsrc%2FApp.js%3A8%2C21
Документацию по доступным реквизитам можно найти здесь — https://mhnpd.github.io/react-loader-spinner/docs/comComponents/rotating-lines
Фрагмент кода прикреплен ниже
<RotatingLines
visible
height = "36"
width = "36"
strokeWidth = "5"
strokeColor = "gray"
animationDuration = "0.75"
ariaLabel = "rotating-lines-loading"
className = "text-white stroke-white"
/>
Откуда вы импортируете компонент
RotatingLines
??