I need Help to Solve React-Router-Dom in Spfx Issue : when i click on Button at that time it changes Parent routing also and create new routing

[vaidik2626]

What type of issue is this?

Question

What SharePoint development model, framework, SDK or API is this about?

💥 SharePoint Framework

Target SharePoint environment

SharePoint Online

What browser(s) / client(s) have you tested

• 💥 Internet Explorer
• 💥 Microsoft Edge
• 💥 Google Chrome
• 💥 FireFox
• 💥 Safari
• mobile (iOS/iPadOS)
• mobile (Android)
• not applicable
• other (enter in the "Additional environment details" area below)

Additional environment details

• browser version
• SPFx version
• Node.js version
• etc

Issue description

when i click on Button at that time it changes Parent routing also and create new routing

This is my Code:
<button className="button" onClick={() => handleChartClick(chartData.lineChart)}>
Line Chart

<button className="button" onClick={() => handleChartClick(chartData.pieChart)}>
Pie Chart

<button className="button" onClick={() => handleChartClick(chartData.columnChart)}>
Column Chart

<button className="button" onClick={() => handleChartClick(chartData.scatterPlot)}>
Scatter Plot Chart

<button className="button" onClick={() => handleChartClick(chartData.areaChart)}>
Area Chart

<button className="button" onClick={() => handleChartClick(chartData.stackedColumnChart)}>
Stacked Column Chart

[Ashlesha-MSFT]

Hello @vaidik2626,
Thank you for bringing this issue to our attention. We will look into it and get back to you shortly.

[Ashlesha-MSFT]

@vaidik2626,
This issue might be related to how navigation and routing are managed in our React application. Could you please inspect the definitions of the objects you've mentioned in the code to ensure they are set up properly?