6

サードパーティの js を sencha アプリケーションに遅延的に追加したいのですが、ボタンをクリックするなどして新しいウィンドウをレンダリングするときだけ、新しいウィンドウがポップアップし、これが発生すると d3.js ライブラリ js も読み込まれます。

Ext js 自体に新しいファイルをロードするには、requires キーを使用できます。

requires : ['MyApp.stores.UserStore']

extjs のドキュメントで説明されているとおりです。サードパーティのライブラリに対してもこのようなことを行うことはできますか?

PS - Ext Js 4.1.0 を使用しています

4

1 に答える 1

5

アップデート

Ext.Loaderを使用すると、ほぼすべてのものをロードできるはずです。loadScript(options)このメソッドは、読み込みが完了したときに呼び出されるコールバックも提供します。

基本的に、ファイルごとに 1 つの ExtJS クラスである限り、何でもロードできます (これ以外は試したことがないことを認めなければなりません!)。を使用して追加のパスを登録できます

Ext.Loader.setPath('EL','your/path/name'); // not done in the example below!

ローダーがそのように構成されている限り、実行時に何かを必要とすることは非常に簡単です。Ext.ux.statusbar.StatusBar以下は、別のドメインと完全な新しいパスから実行時にロードする例です。これがJSFiddleです- ボタンをクリックするだけでクラスがロードされ、その後適用されますaddDocked

Ext.Loader.setPath(  'Ext', 'http://docs.sencha.com/ext-js/4-1/extjs-build/examples');
Ext.create('Ext.Panel', {
    width: 200,
    height: 200,
    renderTo: Ext.getBody(),
    tbar: {
      xtype: 'statusbar',
      statusAlign: 'right',
        items: [
          {
            xtype: 'button', 
            text: 'show window', 
            id: 'ani-target', 
            handler: function(btn) { 
              if (btn.up('panel').down('window').isVisible()) {
                btn.up('panel').down('window').hide();
                btn.setText('maximize');
              }else {
                btn.up('panel').down('window').show();
                btn.setText('minimize');
                Ext.define('Ext.ux.custom.StatusBar',{
                  extend: 'Ext.ux.statusbar.StatusBar',
                  alias: 'widget.cstatus',
                  requires: ['Ext.ux.statusbar.StatusBar'],
                  text: 'Ready',
                  initComponent: function() {
                    this.callParent(arguments);
                  }
                });
                btn.up('panel').down('window').addDocked({ xtype: 'cstatus'});
              } 
            }
          }
        ],
    },
  items: [{
    xtype: 'window',
    closable: false,
    width: 100,
    height: 100,
    id: 'demo-win',
    animateTarget: 'ani-target'
  }]
})
于 2013-01-14T10:59:00.433 に答える