Реагируйте - избегайте закрытия раскрывающегося списка, когда вы разрабатываете аккордеон внутри раскрывающегося списка.

Я использую Semantic UI React, моя структура кода выглядит так:

 <Dropdown icon='plus'>
      <Dropdown.Menu >
             <Accordion>
              <Accordion.Title>
                   Test
              </Accordion.Title>
              <Accordion.Content>
                  Something
              </Accordion.Content>
            </Accordion>
      </Dropdown.Menu>
 </Dropdown>

Я бы хотел, чтобы аккордеон не закрывал раскрывающийся список, щелкнув его заголовок. Я попытался использовать e.stopPropagation() в раскрывающемся списке, но это не сработало. У Вас есть какие-то предложения? :D


reactjs dropdown accordion semantic-ui
person Sofija    schedule 24.06.2020    source источник
comment
попробуйте использовать multiple <Dropdown icon='plus' multiple >   -  person Pankaj Divgi    schedule 24.06.2020
comment
@PankajDivgi Я уже пробовал, эффект тот же   -  person Sofija    schedule 24.06.2020

Ответы (1)


arrow_upward
0
arrow_downward

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

нажмите на первую кнопку CodeSandBox, затем нажмите на галочку, чтобы открыть

в строке 10 изменить:

const newIndex = activeIndex === index ? -1 : index

to:

 const newIndex = index;

сохраните изменения и проверьте сами.

вы можете привести функцию в порядок:

  handleClick = (e, titleProps) => {
    const { index } = titleProps;
    this.setState({ activeIndex: index });
  };
person J Davies    schedule 24.06.2020