Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Earn the coveted Fabric Analytics Engineer certification. 100% off your exam for a limited time only!

Reply
Anonymous
Not applicable

Stop Propagation in React JS Custom Visuals

Hi all, 

I have successfully built a custom visual using the React JS, following this tutorial (https://docs.microsoft.com/pt-br/power-bi/developer/visuals/create-react-visual)  and everything is working fine except the Event StopPropagation,


I developted a Table in React using the Material UI, everything ok, but in the event click (onClick props), im calling that function

 

    selectionManager
      .select(selected.identity, false)
      .then((ids: powerbi.visuals.ISelectionId[]) => {
        console.log("IdsSelecao", ids);
        this.syncSelectionState(selected);
      });

    event.preventDefault();
    event.stopPropagation();

 

 

In the syncSelectionState there are setState, which one call the render, its ok, but there are another unexpected render, calling the update method in the visual.ts consequently , thats render my components again...
Using the d3, this behavior is  treated using this

 

 

        this.selectionManager
            .select(event.identity, true)
            .then((ids: ISelectionId[]) => {
                this.syncSelectionState(this.barSelection, ids, event.identity);
            });
        (<Event>d3.event).stopPropagation();

 

 

I need help to fix that, why doesnt  stopPropagation work? Ive tryiing use 

event.nativeEvent.stopImmediatePropagation() but without sucess

Gabriel.

1 REPLY 1
Anonymous
Not applicable

Anybody? I have no ideia to solve that

Helpful resources

Announcements
April AMA free

Microsoft Fabric AMA Livestream

Join us Tuesday, April 09, 9:00 – 10:00 AM PST for a live, expert-led Q&A session on all things Microsoft Fabric!

March Fabric Community Update

Fabric Community Update - March 2024

Find out what's new and trending in the Fabric Community.

Top Solution Authors