'Next JS Custom Select dropdown icon on click does not trigger the options to display
I am new to Next JS and I have a custom select menu dropdown with an array of options. The select has an arrow icon that I included by using css psudo ::after with background image. When the user clicks the icon(svg), the dropdown is not triggered and I am not sure how to make this work.
I have tried using useRef and setting it to the component then on button click I tried to use ref.current.click() which doesnt trigger the drop down.
I also tried including the arrow icon inside the component rather than use CSS but this was unsuccessful as well.
Can someone please advise me how to make this functionality work? Thank you in advance for any help, it is much appreciated.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|