Загрузка компонента React из кнопки нажмите Extjs - PullRequest
Новая
       51

Загрузка компонента React из кнопки нажмите Extjs

1 голос
/ 18 июня 2020

В настоящее время я работаю над интеграцией проекта реакции с существующим проектом ext js. Требование состоит в том, чтобы загрузить компонент реакции на страницу ext js при нажатии кнопки, кнопка находится в проекте ext

1 Ответ

1 голос
/ 18 июня 2020

Это не так просто, но вы можете начать со следующего небольшого кода: 

Ext.create('Ext.panel.Panel', {
    title: 'Hello',
    width: 200,
    height: 300,
    dockedItems: [{
        xtype: 'toolbar',
        items: [{
            text: "Load React Component",
            handler: function () {
                const panel = this.up('panel');
                const e = React.createElement;
                ReactDOM.render(
                    e('div', null, 'React'),
                    panel.body.el.dom
                );
            }
        }]
    }],
    renderTo: Ext.getBody()
});

и индекс. html

<HTML>
<HEAD>
    <script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
    <!-- for Production -->
    <!--<script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>-->
    <!--<script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>-->
</HEAD>
<BODY>
</BODY>

Fiddle

Или вы создаете div с некоторым идентификатором в теле панели ext js, используя шаблон или свойство htmn панели, и визуализируете там свой проект реакции.

PS, очень плохая идея интегрировать ext js с реакцией.

...