1

I am working on a project where the requirement is whenever an input element is clicked(focused) accordion should open.

I used below code for this

const [accordion, setaccordion] = useState<number>();

const handleAccordion = (id : number) => {
  setaccordion(id);
}

<InputText 
          placeholder="Summarize your problem"
          className="w-100 border border-color question-title-input m-2rem mx-0 mt-0 
          text-q-grey px-4 py-3"
          value={questionTitle}
          onChange={(e) => setQuestionTitle(e.target.value)}
          onFocus={(e) => handleAccordion(0)}
          
        />

I passed this as a prop to another component,now I want to update the state of accordion ,could anyone please share their expertise how to do it , I some how reached till below but not sure how to proceed

<Accordion
       onTabChange={e => setState({ activeIndex: [e.index] })}
       activeIndex={id}
      className="q-accordion"
      expandIcon="pi pi-chevron-down"
      collapseIcon="pi pi-chevron-up"
    >

Note : accordion should open on click on input element as well as manually also.

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102
manoj thayil
  • 21
  • 1

1 Answers1

0

here is a CodeSandbox which solves your problem.

Alex Petrov
  • 1
  • 1