如何更改语义UI手风琴中的下拉图标?

时间:2019-01-08 16:53:20

标签: javascript reactjs semantic-ui

如何更改语义UI反应手风琴中的下拉图标?

const panel1Panels = [
{ key: 'panel-1a', title: 'Panel 1A', content: 'Panel 1A Contents' },
{ key: 'panel-1b', title: 'Panel 1B', content: 'Panel 1B Contents' },
]
const AccordionExample = () =>
            <Accordion defaultActiveIndex={0} panels={panel1Panels} styled />

1 个答案:

答案 0 :(得分:0)

您可以像Semantic-UI React示例中一样手动添加面板

self.view

或者您可以在标题字段中添加图标

<Accordion>
        <Accordion.Title active={activeIndex === 0} index={0} onClick={this.handleClick}>
          <Icon name='dropdown' />
          What is a dog?
        </Accordion.Title>
        <Accordion.Content active={activeIndex === 0}>
          <p>
            A dog is a type of domesticated animal. Known for its loyalty and faithfulness, it can
            be found as a welcome guest in many households across the world.
          </p>
        </Accordion.Content>

        <Accordion.Title active={activeIndex === 1} index={1} onClick={this.handleClick}>
          <Icon name='dropdown' />
          What kinds of dogs are there?
        </Accordion.Title>
        <Accordion.Content active={activeIndex === 1}>
          <p>
            There are many breeds of dogs. Each breed varies in size and temperament. Owners often
            select a breed of dog that they find to be compatible with their own lifestyle and
            desires from a companion.
          </p>
        </Accordion.Content>

        <Accordion.Title active={activeIndex === 2} index={2} onClick={this.handleClick}>
          <Icon name='dropdown' />
          How do you acquire a dog?
        </Accordion.Title>
        <Accordion.Content active={activeIndex === 2}>
          <p>
            Three common ways for a prospective owner to acquire a dog is from pet shops, private
            owners, or shelters.
          </p>
          <p>
            A pet shop may be the most convenient way to buy a dog. Buying a dog from a private
            owner allows you to assess the pedigree and upbringing of your dog before choosing to
            take it home. Lastly, finding your dog from a shelter, helps give a good home to a dog
            who may not find one so readily.
          </p>
        </Accordion.Content>
      </Accordion>