19

Extjs4librairieに問題があります。treeEditorコンポーネントを使用したい。

Firebugエラー:

エラー:キャッチされない例外:Ext.Loaderが有効になっていないため、依存関係を動的に解決できません。必要なクラスがありません:Ext.tree.TreeNode

私のコード:

Ext.require([

'Ext.form.*',
'Ext.grid.*',
'Ext.tree.*',
'Ext.data.*',
'Ext.util.*',
'Ext.loader.*',
'Ext.state.*',
'Ext.layout.container.Column',
'Ext.tab.TabPanel'

]);

Ext.onReady(function(){

    // shorthand
    Ext.QuickTips.init();


    var tree = Ext.create('Ext.tree.TreePanel', {
            animate:false,
            enableDD:false,
    //      loader: new Tree.TreeLoader(), // Note: no dataurl, register a TreeLoader to make use of createNode()
            lines: true,
            rootVisible:false,
        //  selModel: new Ext.tree.MultiSelectionModel(),
            containerScroll: false
    });

        // set the root node
        var root = Ext.create('Ext.tree.TreeNode',{
            text: 'Autos',
            draggable:false,
            id:'source'
        });

        tree.on('contextmenu',showCtx);
        tree.on('click',function(node,e){node.select();return false;});
        // json data describing the tree

        var json = [
                {"text" : "1","allowEdit" : true, "id" : 300, "leaf" : false, "cls" : "folder", "children" : [
                {"text" : "11","allowEdit" : true, "id" : 3000, "leaf" : false, "cls" : "folder","children" :[
                {"text" : "111","allowEdit" : true, "id" : 300, "leaf" : false, "cls" : "folder","children" :[
                {"text" : "1111","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"},
                {"text" : "1112","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"},
                {"text" : "1113","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"}
                ]},
                {"text" : "112","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"},
                {"text" : "113","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"}
                ]},
                {"text" : "12","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"},
                {"text" : "13","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"}
                ]},
                {"text" : "2","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file"},
                {"text" : "3","allowEdit" : true, "id" : 300, "leaf" : true, "cls" : "file",iconCls:'node'}
                ];

                for(var i = 0, len = json.length; i < len; i++) {
                root.appendChild(tree.getLoader().createNode(json[i]));
                }

        var ge = Ext.create('Ext.tree.TreeEditor',tree,{},{
            allowBlank:false,
            blankText:'Nom du dossier',
            selectOnFocus:true,
            cancelOnEsc:true,
            completeOnEnter:true,
            ignoreNoChange:true,
            updateEl:true
            });

            /*ge.on('beforestartedit', function(){

            if(!ge.editNode.attributes.allowEdit){
                return false;
            }
                });*/

        tree.setRootNode(root);
        tree.render();
        root.expand(true);

        });

ありがとう :)

4

4 に答える 4

50

このエラーは、ローダーが有効になっていないことが原因です。次の方法でExt.Loaderを有効にできます。

Ext.Loader.setConfig({enabled:true});

onReadyメソッドの開始時にこれを呼び出す必要があります。

于 2011-04-19T11:56:27.907 に答える
2

これはExtJs4でうまくいきましたExt.Loader.setConfig({enabled:true});。app.jsの一番上に追加されました。

于 2012-09-02T05:19:13.067 に答える
1

本当の問題は、ext-debug.js、ext.jsを使用していることです

代わりに、ext-all.jsまたはext-dev.jsを使用してください

ダイナミックローディングについて読む

index.htmlの例:

<html>
  <head>
      <title>Hello Ext</title>
      <link rel="stylesheet" type="text/css" href="ext-4/resources/css/ext-all.css">
      <script type="text/javascript" src="ext-4/ext-dev.js"></script>
      <script type="text/javascript" src="app.js"></script>
  </head>
  <body></body>
</html> 

この例では、動的ロードは開発環境用であるため、動的ロードを有効にする必要はありません。ext-all.js、ext.jsはデプロイ用です。ext-all-debug.jsおよびext-debug.jsは、デプロイ後のデバッグ用です。

sencha cmd(別名Sencha Tools)によって生成されたファイルが1つ必要なため、MVCと動的ロードはデプロイでは役に立ちません。

于 2012-11-12T22:15:40.803 に答える
1

私はこれを見て、ExtJSの初心者なので、少し後退する必要がありました。OnReadyの呼び出しの前に、一般化された場所のステートメントについて何が言われたのかはっきりしませんでした。

バージョン5.0のSenchaAPIDocs Webサイトの次の例も、Ext.Loaderクラスへの呼び出しの配置をよく理解するためにこの例を示しています。私の意見では、複数のJavaScriptタグで少し誇張されています。

<script type="text/javascript" src="ext-core-debug.js"></script>
<script type="text/javascript">
    Ext.Loader.setConfig({
      enabled: true,
      paths: {
          'My': 'my_own_path'
      }
    });
</script>
<script type="text/javascript">
    Ext.require(...);

    Ext.onReady(function() {
      // application code here
    });
</script>

以下のように追加した自分の個人コードに加えた変更も問題なく機能しました。これは非常に単純です。

Ext.Loader.setConfig({enabled:true});

Ext.application({
    name                : 'MyApp',
    appFolder           : 'app',
    controllers         : [
        'MyApp.controller.item.Item'
    ],
    autoCreateViewport  : true

});

ローダーに問題がある場合は、Ext.requireクラスとExt.excludeクラスも確認して、これらがどのように相互作用してカスタムクラスをロードするかを理解することをお勧めします。

于 2014-08-28T16:21:40.070 に答える