How to integrate PayPal button into Extjs environment?

While there is a number of tutorials on Paypal Payment Integration, there is no one dealing wit EXTJS framework. Integration of PayPal button is pretty straightforward in index.html page:

<!DOCTYPE html>
<html lang="en">

<head>
    <!-- Add meta tags for mobile and IE -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title> PayPal Smart Payment Buttons Integration | Horizontal Buttons </title>
</head>

<body>
    <!-- Set up a container element for the button -->
    <div id="paypal-button-container"></div>

    <!-- Include the PayPal JavaScript SDK -->
    <script src="https://www.paypal.com/sdk/js?client-id=sb&currency=USD"></script>

    <script>
        // Render the PayPal button into #paypal-button-container
        paypal.Buttons({
            style: {
                layout: 'horizontal'
            }
        }).render('#paypal-button-container');
    </script>
</body>

</html>

But, how to include it in EXTJS? I do not understand how to mix extjs MVC or MVVM architecture with plain javascipt and html code.

Solution

Include the html part in a container and put the buttons code in the after render event

Ext.define('MyApp.view.MyPanel', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.mypanel',


    title: 'Main Panel',
    height:400,

    items: [
        {
            xtype: 'container',
            width: 200,
            border: true,
            height: 400,
            html:'<div id="paypal-button-container"></div>',
            listeners:{
            
                afterrender: function (){
                      paypal.Buttons({
                  
                     }).render('#paypal-button-container');
                
                }
            }
        },
    ],

});


Ext.application({
    views: [
        'MyPanel'
    ],
    name: 'MyApp',

    launch: function() {
        Ext.create('MyApp.view.MyPanel', {renderTo: Ext.getBody()});
    }

});