Как я могу установить дисплей Flex в моем ползунке реакции? - PullRequest
1 голос
/ 26 февраля 2020

Это мой слайдер

<Slider {...settings}>
  <div style={{ 'display': 'flex !important' }}>
    <ArrowsToolComponent key={name} color={color} />
    <ZoomTool key={name} color={color} />
  </div>
  <div>
    <GridToolComponent key={name} color={color} />
    <CropToolComponent disabled={disabled} key={name} color={color} />
  </div>
  <div>
    <FlipTool disabled={disabled} key={name} color={color} />
    <PriorityToolComponent disabled={disabled} key={name} color={color} />
  </div>
  <div>
    <CopyFileToolComponent disabled={false} key={name} color={color} />
    <CancelFileToolComponent disabled={disabled} key={name} color={color} />
  </div>
  <div>
    <InsertTextBox key={name} color={color} />
    <InsertImageBox key={name} color={color} />
  </div>
</Slider>

Как мне настроить отображение: сгибать в div в моем слайдере? В документах о реакциях нет информации об этом. Это всегда встроенный блок по умолчанию.

1 Ответ

0 голосов
/ 26 февраля 2020

При написании компонентов с использованием React мы можем принимать другие реквизиты , отличные от необходимых , и деконструировать их в нашем компоненте. Похоже, что из этой библиотеки поддерживается передача style реквизитов .

Если реквизиты по умолчанию отсутствуют, вы сможете использовать свойство React style, например:

<Slider {...settings} style={{ display: 'flex' }}>
   { /* rest of the code */}
</Slider>

Если у компонента есть defaultProps, React визуализирует компонент, используя их, , если родитель не переопределит его . Таким образом, вы также можете создать Parent <div> с вашими необходимыми стилями, которые могут быть:

<div style={{ display: 'flex' }}>
 <Slider {...settings}>
   { /* rest of the code */}
 </Slider>
</div>
...