在Ext Js视口中动态加载内容(面板)

Question

基本上我正在研究这个问题,我有许多组件与dinamic东西,在服务器端用PHP编写.

根据用户的不同,我的组件将根据用户的角色进行更改.

所以我需要知道如何做到这一点的任何方式/示例/信息.

1-我使用了EXTJS的加载功能,但它清楚地说我不会加载脚本只有纯文本.

2-我使用了eval()但是这个方法有点害怕,就像这个例子crate layout component(static)

var contentPanel = new Ext.Panel({
                frame: true,
                style: {marginTop: '10px'},
                height: 315,
                border: true,
                bodyBorder: false,
                layout: 'fit',
                id: 'contentPanel'
            });


            var mainPanel = new Ext.Panel({
                title: 'Panel Principal',
                id: 'mainPanel',
                border: true,
                frame: true,
                width: '50%',
                style: {margin: '50px auto 0 auto'},
                height: 400,
                renderTo: Ext.getBody(),
                items: [
                        {
                            html: '<a href="#" onClick="requestContent(\'panel1\');">Panel 1</a>'
                        },
                        {
                            html: '<a href="#" onClick="requestContent(\'panel2\');">Panel 2</a>'
                        },
                        contentPanel

                ]
            })

并使用写在服务器上的js文件更新布局的内容

function receiveContent(options, success, response)
        {



            var respuesta = response.responseText;

            //console.log(respuesta);

            eval(respuesta);

            //console.log(options.url);

            url = options.url;

            url = url.substring(0,(url.search(/(\.)/)));

            var contenedor = Ext.getCmp('contentPanel');

            contenedor.removeAll();

            var contenido = Ext.getCmp(url);

            contenedor.add(contenido);
            contenedor.doLayout();
        }

        function requestContent(panel)
        {
            //panel es el nombre del archivo que quiero
            Ext.Ajax.request({
                url: panel+'.js',
                callback: receiveContent
            });
        }

要做到这一点的任何其他方式,我不想做的是制作一百万个不同的组件并在登录时加载所有组件,就像许多人似乎说的那样

Answer 1

解决您的问题：

1. .load 方法将加载脚本并在内容完成加载后对其进行评估，但是要完成此操作，您需要设置 script:true 选项，示例可能是：

my_panel.load({
  url: 'url_to_load.php/hmt/html/asp...',
  params: {param1: param1value, param2: param2value...etc},
  nocache: true,
  timeout: 30,
  scripts: true
});

2. 使用 eval() 很好……但是看到上面的 script:true 配置选项可以在源文件中为 javascript 完成此操作，您不需要使用它。

希望这可以帮助