Scopes in react function

Is it possible to declare a global function in react? mainly arrow function.


It’s just JavaScript, exactly the same rules apply, React doesn’t do anything special in this regard. If you want a global, create a global. Can you explain what you’re trying to do and why, because it’s highly unlikely that you need a global and I can almost guarantee there will be a better way to do things.

I want to create a function that when the user clicks or double-clicks an image, it opens in an image editor on another page.

This is what I want to do.

What do you mean by “another page”. This could mean one of several different things, you need to clarify

My site will contain about 4 or 5 pages. In one .js file, the user can search an image in image tiles and search the proper image based on subject and after clicking the image, that will open in an image editor on another .js file.

No, again need a bit more clarification. What do you mean by “page”. I realise it is clear to you, but I am not looking at your code.

When you say “in one JS file”, that normally doesn’t bear any relation, in practice, to most concept of “pages”, it’s all basically going to be one file in the end.

It’s not any special project. I’m just trying to learn react. I mean after the user clicks the image, the image opens in an image editor in another file.
I’m super new to react. I don’t know how to say. How should I say? It’s a file transfer between two .js files in one project.

It sounds to me like you’re wanting to navigate to another page in your app. Are you using navigation, like react router?

Also, in a large app, I think the ideal of “global” starts to break down. You can have a “global” function in some file, in that it is defined on the root level. But you would still need to import it if you want to use it in a different file. Is that “global”? I don’t know. But you are still managing its usage. And in general, things should have as narrow a scope as possible. But creating a helper function that gets imported and used all over the place? Yeah, that’s pretty common.

Is any prefix should be use for global field or function?
For example in C# use public for global and private for local class.

Well, not really, that’s not what those keywords mean. It uses public for a property that is accessible externally to a class or a class that is accessible outside an assembly, and private for internal methods or classes internal to an assembly. The same thing can be easily emulated with JS. However that has nothing to do with globals.

I understand that, and I understand that as a beginner it’s difficult to know which questions to ask. I’m not trying to be difficult, but this is why clarity is important. People here can definitely help you get this working, but we need something to work with.

You aren’t trying to open a file, you’re trying to run some code. The fact it’s in another file doesn’t make any difference. If you are using something like React router to make the app work as if you have a set of different web pages, then it provides you with a <Link> component – you define the route you want for your image editor component somewhere high up in the app, then you use the Link to go to that route when the user clicks on the image. But I don’t know if that is what you are doing, this is what I’m trying to get at.

As with all things in React, if you have some property that needs to be accessible to different components, then you move that property up to a component that is above all the components that need it, and you pass it down to them – it is normally called lifting state up

So you have an image. That image can be edited using [I assume] some React library. That library [I assume] exposes some component or components. They will take props, one of which [I assume] will be an image or the URL of an image or whatever. You want that image editor to take up the full screen [this is what I assume you mean by “new page”]. Do you see why it’s difficult to advise? There are already a lot of assumptions

Can you please give an example related to this part?