[React] How to update View Main's State from Panel?

In a React F7 app, I got an “input” element on the right panel, that I use to compute some dynamic data that I want to send over to the main view, without reloading the entire app.

How can I send JSON data from Panel to View Main OR call a function of View Main, to trigger updating the View main’s state and re-render its content?

<App params={ this.state.f7params }>
...
    <Panel right cover themeDark>
        ...
        <input ... onChange={ (e) => {
            calculateSomething;
            ........;
            send the JSON data to View Main
            OR call a function in View Main,
            to trigger re-rendering of the View Main Page;
        } />
        ....
    </Panel>
    ...
    <View main className="safe-areas" url="/" />
</App>

Using events:

events.js

import Framework7 from 'framework7';

const events = new Framework7.Events();

export default events;

Where you need to send data

import events from '...';

events.emit('somethingHappened', {...data...});

Where you need to handle it:

import events from '...';

events.on('somethingHappened', (data) => {
  // do something
});

That worked great, thanks so much for your help!