如何在语义UI React Accordion中更改标题图标

Question

https://react.semantic-ui.com/modules/accordion

on their first example, I have a requirement where I need another icon instead of dropdown.

I need to replace it with "angle right, angle down".

<Accordion.Title active={activeIndex === 2} index={2} 
onClick={this.handleClick}>

  <Icon name='dropdown' />/* dropdown to angle right or down*/

  How do you acquire a dog?

</Accordion.Title>

Is anyone has experience with this? how to change title icon on react-semantic-Accordion

Answer 1

Change the name of the icon :

<Icon name='chevron right' />

ref : React semantic icon set

Answer 2

I just faced this issue myself and since OP didn't post his solution, the following might help others.

The same logic used to determine if the accordion is active can be used to set the title. Simply use a const for the icon name like

const iconName = activeIndex === 2 ? 'chevron down' : 'chevron right';
<Accordion.Title active={activeIndex === 2} index={2} this.handleClick}>

  <Icon name={iconName} />/* dropdown to angle right or down*/

  How do you acquire a dog?

</Accordion.Title>