How to Pass Variable From Divi Module PHP variable value to React JSX

Question

I created my own custom Divi extension .I setup Hello world Module I want to pass the myName php variable value to Frontend React JSX file , but it's unsuccessful. Please help me to rectify this issue.

Helloworld.php

<?php

class FABT_HelloWorld extends ET_Builder_Module
{

    public $slug = 'fabt_hello_world';
    public $vb_support = 'on';
    public $myName = "Sameera";

    protected $module_credits = array(
        'module_uri' => '',
        'author' => '',
        'author_uri' => '',
    );

    public function init()
    {
        $this->name = esc_html__('Hello World', 'fabt-featured-author-book-title');

    }

    public function get_fields()
    {
        return array(
            'content' => array(
                'label' => esc_html__('Content', 'fabt-featured-author-book-title'),
                'type' => 'tiny_mce',
                'option_category' => 'basic_option',
                'description' => esc_html__('Content entered here will appear inside the module.', 'fabt-featured-author-book-title'),
                'toggle_slug' => 'main_content',
            ),

        );
    }

    public function render($attrs, $content = null, $render_slug)
    {
        return sprintf('<h1>%1$s</h1><h1>%2$s</h1>', $this->props['content'], $this->myName);
    }
}

new FABT_HelloWorld;

Helloworld.jsx

// External Dependencies
import React, { Component } from 'react';

// Internal Dependencies
import './style.css';


class HelloWorld extends Component {

  static slug = 'fabt_hello_world';

  render() {
    const Content = this.props.content;
    alert(this.state.myName.rendered);

    return (
      <h1>
        <Content/>
      </h1>
    );
  }
}

export default HelloWorld;