Discussion on: Hot to call this function from another component in react?

My reply is based off on your Sandbox: codesandbox.io/s/strange-dust-98uwd

You can follow along w/ my fork: codesandbox.io/s/objective-mcnulty...

Here are a few things worth mentioning.

First issue

You are exporting uCyr as a default module.

export default uCyr;

That means, you need to either alias it as uCyr in the calling code, or not use {} during import.

// from 
import { Ucyr } from "./Ucyr";
// to either
import Ucyr from "./Ucyr";
// or 
import { default as Ucyr } from "./Ucyr";

2nd issue

To bind an event handler, you shouldn't pass a string to onClick but actual function expression.

// instead of 
<button onClick="Ucyr()">У ЋИРИЛИЦУ</button>
// You should do
<button onClick={() => Ucyr()}>У ЋИРИЛИЦУ</button>
// or using a short-hand syntax
<button onClick={Ucyr}>У ЋИРИЛИЦУ</button>

Recommendation

Instead of getting the textarea using document.getElementById("textarea"), you should store the textarea value as a React state. Or you can use ref (but discouraged).

It seems like you are used to the jQuery's unobstrusive coding style, but React requires a different mindset.

All changes should be state driven.

If you are unfamiliar with React states, I'd recommend React documentation.

reactjs.org/docs/state-and-lifecyc... or other materials of your choice because it's a very basic React knowledge required.