Как изменить цвет фона переключателя реаги- bootstrap (часть компонента «Формы») с помощью Emotion - PullRequest
0 голосов
/ 20 февраля 2020

Как вы обновляете синий цвет фона по умолчанию для переключателя , обнаруженного в реакции- bootstrap (не реагирует- bootstrap -переключатель), используя Emotion?

Когда я go в Chrome devtools. Я могу внести изменения, но, похоже, не могу понять их правильно на стороне React.

от devtools

enter image description here enter image description here

моя попытка

<Form>
  <Form.Switch
    id="custom-switch"
    label="text goes here"
    bsCustomPrefix={`custom-control-input:checked~custom-control-label::before ${css`background: red;`}`}
  />
</Form>

Я также пытался использовать className вместо bsCustomPrefix.

что на самом деле происходит

enter image description here

весь предмет изменяется.

1 Ответ

0 голосов
/ 02 марта 2020

Трудно сказать наверняка, так как нет примера кода, вы пробовали что-то вроде этого:

import styled from '@emotion/styled';

<Form>
  <CustomSwitch
    id="custom-switch"
    label="text goes here"
    bsCustomPrefix={`custom-control-input:checked~custom-control-label::before`}
  />
</Form>

const CustomSwitch = styled(Form.Switch)`
  &::before {
    background: red
  }
`

...