cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Frequent Visitor

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
Frequent Visitor

Anybody? I have no ideia to solve that

Helpful resources

Announcements
secondImage

Happy New Year from Power BI

This is a must watch for a message from Power BI!

December Update

Check it Out!

Click here to read more about the December 2020 Updates!

Community Blog

Check it Out!

Click here to read the latest blog and learn more about contributing to the Power BI blog!

Get Ready for Power BI Dev Camp

Get Ready for Power BI Dev Camp

Mark your calendars and join us for our next Power BI Dev Camp!.