QooXDoo树实例

Question

我正在尝试使用qooxdoo3.5构建一个应用程序，并且遇到了一个问题，当我没有添加树时，我得到了一个错误：

未定义TypeError:无法读取未定义属性“树”

应用程序使用演示中的两个代码部分:小部件-树和布局-hsplit。我已经尝试重建应用程序，并修改config.json文件(没有帮助，也许我做错了什么)。守则如下：

/**
 * This is the main application class of your custom application "sphinx2"
 *
 * @asset(sphinx2/*)
 */
qx.Class.define("sphinx2.Application",
{
  extend : qx.application.Standalone,

  members :
  {
    /**
     * This method contains the initial application code and gets called 
     * during startup of the application
     * 
     * @lint ignoreDeprecated(alert)
     */
    main : function()
    {
      // Call super class
      this.base(arguments);
      this.addSplitPaneTwoFlexSimple();

    var hBox = new qx.ui.layout.HBox();
      hBox.set(
        {
          spacing: 20
        });
      var container = new qx.ui.container.Composite(hBox);
      this.getRoot().add(container);

      var tree = this.getTree();
      container.add(tree);

      var commandFrame = this.getCommandFrame(tree);
      container.add(commandFrame);

      // Enable logging in debug variant
      if (qx.core.Environment.get("qx.debug"))
      {
        // support native logging capabilities, e.g. Firebug for Firefox
        qx.log.appender.Native;
        // support additional cross-browser console. Press F7 to toggle visibility
        qx.log.appender.Console;
      }
    },

    addSplitPaneTwoFlexSimple : function()
    {
      var splitpane = new qx.ui.splitpane.Pane("horizontal");
      splitpane.setWidth(400);
      splitpane.setHeight(60);
      splitpane.setDecorator("main");
      this.getRoot().add(splitpane, {left:20, top:20});
      // Left
      var leftWidget = new qx.ui.form.TextArea("Flex:1");
      leftWidget.setDecorator(null);
      leftWidget.setWrap(true);
      splitpane.add(leftWidget, 1);
      // Right
      var rightWidget = new qx.ui.form.TextArea("Flex:2");
      rightWidget.setDecorator(null);
      rightWidget.setWrap(true);
      splitpane.add(rightWidget, 2);
    },

     getTree : function()
    {
      var tree = new qx.ui.tree.Tree().set({
        width : 200,
        height : 400,
        draggable: true
      });
      var root = new qx.ui.tree.TreeFolder("root");
      root.setOpen(true);
      tree.setRoot(root);
      var te1 = new qx.ui.tree.TreeFolder("Desktop");
      te1.setOpen(true);
      te1.setIcon("icon/22/places/user-desktop.png");
      root.add(te1);
      var te1_1 = new qx.ui.tree.TreeFolder("Files");
      var te1_2 = new qx.ui.tree.TreeFolder("Workspace");
      var te1_3 = new qx.ui.tree.TreeFolder("Network");
      var te1_4 = new qx.ui.tree.TreeFolder("Trash");
      te1.add(te1_1, te1_2, te1_3, te1_4);
      var te1_2_1 = new qx.ui.tree.TreeFile("Windows (C:)");
      var te1_2_2 = new qx.ui.tree.TreeFile("Documents (D:)");
      te1_2.add(te1_2_1, te1_2_2);
      var te2 = new qx.ui.tree.TreeFolder("Inbox");
      var te2_1 = new qx.ui.tree.TreeFolder("Presets");
      var te2_2 = new qx.ui.tree.TreeFolder("Sent");
      var te2_3 = new qx.ui.tree.TreeFolder("Trash");
      for (var i=0; i<30; i++) {
        te2_3.add(new qx.ui.tree.TreeFile("Junk #" + i));
      }
      var te2_4 = new qx.ui.tree.TreeFolder("Data");
      var te2_5 = new qx.ui.tree.TreeFolder("Edit");
      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5);
      root.add(te2);
      return tree;
    },
  }
});

拜托，告诉我我做错了什么？

Answer 1

所以，我到处玩代码，发现第二个函数之后的逗号应该被删除，树声明可以在函数中完成，而不是在函数之外。耽误您时间，实在对不起。由此产生的工作代码：

/**
 * This is the main application class of your custom application "sphinx2"
 *
 * @asset(sphinx2/*)
 */
qx.Class.define("sphinx2.Application",
{
  extend : qx.application.Standalone,
  /*
  *****************************************************************************
     MEMBERS
  *****************************************************************************
  */
  members :
  {
    /**
     * This method contains the initial application code and gets called 
     * during startup of the application
     * 
     * @lint ignoreDeprecated(alert)
     */
    main : function()
    {
      // Call super class
      this.base(arguments);
      this.addSplitPaneTwoFlexSimple();
      // Enable logging in debug variant
      if (qx.core.Environment.get("qx.debug"))
      {
        // support native logging capabilities, e.g. Firebug for Firefox
        qx.log.appender.Native;
        // support additional cross-browser console. Press F7 to toggle visibility
        qx.log.appender.Console;
      }
    },
      /*
      -------------------------------------------------------------------------
        Below is your actual application code...
      -------------------------------------------------------------------------
      */
    addSplitPaneTwoFlexSimple : function()
    {
      var splitpane = new qx.ui.splitpane.Pane("horizontal");
      splitpane.setWidth(400);
      splitpane.setHeight(60);
      splitpane.setDecorator("main");
      this.getRoot().add(splitpane, {left:20, top:20});
      // Left
      var tree = this.getTree();
      splitpane.add(tree, 1);
      // Right
      var rightWidget = new qx.ui.form.TextArea("Flex:2");
      rightWidget.setDecorator(null);
      rightWidget.setWrap(true);
      splitpane.add(rightWidget, 2);
    },
     getTree : function()
    {
      var tree = new qx.ui.tree.Tree().set({
        draggable: true
      });
      var root = new qx.ui.tree.TreeFolder("root");
      root.setOpen(true);
      tree.setRoot(root);
      var te1 = new qx.ui.tree.TreeFolder("Desktop");
      te1.setOpen(true);
      te1.setIcon("icon/22/places/user-desktop.png");
      root.add(te1);
      var te1_1 = new qx.ui.tree.TreeFolder("Files");
      var te1_2 = new qx.ui.tree.TreeFolder("Workspace");
      var te1_3 = new qx.ui.tree.TreeFolder("Network");
      var te1_4 = new qx.ui.tree.TreeFolder("Trash");
      te1.add(te1_1, te1_2, te1_3, te1_4);
      var te1_2_1 = new qx.ui.tree.TreeFile("Windows (C:)");
      var te1_2_2 = new qx.ui.tree.TreeFile("Documents (D:)");
      te1_2.add(te1_2_1, te1_2_2);
      var te2 = new qx.ui.tree.TreeFolder("Inbox");
      var te2_1 = new qx.ui.tree.TreeFolder("Presets");
      var te2_2 = new qx.ui.tree.TreeFolder("Sent");
      var te2_3 = new qx.ui.tree.TreeFolder("Trash");
      for (var i=0; i<30; i++) {
        te2_3.add(new qx.ui.tree.TreeFile("Junk #" + i));
      }
      var te2_4 = new qx.ui.tree.TreeFolder("Data");
      var te2_5 = new qx.ui.tree.TreeFolder("Edit");
      te2.add(te2_1, te2_2, te2_3, te2_4, te2_5);
      root.add(te2);
      return tree;
    }
  }
});

Answer 2

听起来qx.ui.tree.Tree依赖项不包含在生成的应用程序中。您确定使用了适当的生成器作业，即开发版本( generate.py source ) (sphinx2/source/index.html)吗？

Answer 3

请执行./Generatedis洁净，然后是./generate -所有，并查看错误是否仍然发生--没有发生在我身上，而且我在过去确实经历过由于缓存损坏而导致的错误构建。

在构建和运行代码时，我得到了什么-- getCommandFrame()不是一个函数--很可能是因为您忘记了包含它。