Clicking a component over the screen also affects the background


#1

I have a component which is window that is visible only sometimes to save some data. This componen has two buttons to be clicked and it becomes invisible again. My issue is that sometimes one of these buttons happens to be right over something clickable in the main screen (background), and if I click in the button, it also receives the click in the main screen. How could I do it so what’s behind the component is not affected by what I do over it?


#2

Maybe using the ”clicktrough setting” for component solves this? It’s under the basic settings when you select the component.


#3

I don’t see that option anywhere. When I select the component I can see the “Default size”, “Conten-aware sizing”, “Screen responsiveness”, etc. but I don’t see the “clickthrough setting” anywhere. What am I missing?


#4

Hi,
i use this https://sweetalert2.github.io/#download
loaded with a custom plugin…

this.getReactWebPackages = function() {
return { “sweetalert2” : “^9.13.1”}

}

this.getReactWebImports = function(exporter) {
return [
{varName: “Swal”, path: “sweetalert2”},{path:“sweetalert2/dist/sweetalert2.min.css”}
];
}


#5

Hi,

We’re on vacation for the next couple of weeks so the support for free users is really limited at that time. Anyway here’s the screenshot of my RS.


#6

No problem at all. I see in the screenshot that it is not a component property but an element property. That’s where I was lost and I didn’t know where to find the feature. I believe I know now how to make it done. Thank you!


#7

Actually It’s not element setting it’s setting for nested component. Component itself cannot have this kind of setting because this setting depends on the context where the component is placed.


#8

I already saw it! My mistake is that I was looking for that when clicking in the component itself but not in the context where it is nested. After seeing the screenshot it made sense. I

Thank you so mucho and I am sorry about my clumsiness :slight_smile: