Javascript 在不使用HTML的情况下以编程方式创建dojox/app视图

Javascript 在不使用HTML的情况下以编程方式创建dojox/app视图,javascript,dojo,Javascript,Dojo,我正在考虑制作一个web应用程序,并考虑使用dojox/app来实现它 我更愿意使用一种更具编程性的方法来处理dojo,但dojox/app似乎主要是声明性的 经过一些搜索,我发现了一个档案,问的问题基本上与我的问题相同 干草伙计们, 我一直在看dojox.app的livedocs,虽然它看起来很酷,但我不得不说有些东西我不清楚 具体来说,视图的“模板”属性(指定html文件)是必须的还是可选的 这是在2012年 从那时起,我在文档中的示例中找到了customeApp测试,它似乎显示了dojo

我正在考虑制作一个web应用程序,并考虑使用dojox/app来实现它

我更愿意使用一种更具编程性的方法来处理dojo,但dojox/app似乎主要是声明性的

经过一些搜索,我发现了一个档案,问的问题基本上与我的问题相同

干草伙计们, 我一直在看dojox.app的livedocs,虽然它看起来很酷,但我不得不说有些东西我不清楚

具体来说,视图的“模板”属性(指定html文件)是必须的还是可选的

这是在2012年

从那时起,我在文档中的示例中找到了customeApp测试,它似乎显示了dojox/app中的基本编程视图,但是我在理解它时遇到了一些困难

我想像这样创建我的应用程序的不同视图

require([
  "dojo/dom",
  "dojo/ready",
  "dojox/mobile/Heading",
  "dojox/mobile/ToolBarButton"
], function(dom, ready, Heading, ToolBarButton){
  ready(function(){
    var heading = new Heading({
      id: "viewHeading",
      label: "World Clock"
    });
    heading.addChild(new ToolBarButton({label:"Edit"}));
    var tb = new ToolBarButton({
      icon:"mblDomButtonWhitePlus",
      style:"float:right;"
    });
    tb.on("click", function(){ console.log('+ was clicked'); });
    heading.addChild(tb);
    heading.placeAt(document.body);
    heading.startup();
  });
});
但我只能找到这样的例子

<div data-dojo-type="dojox/mobile/Heading" data-dojo-props='label:"World Clock"'>
  <span data-dojo-type="dojox/mobile/ToolBarButton">Edit</span>
  <span data-dojo-type="dojox/mobile/ToolBarButton"
        data-dojo-props='icon:"mblDomButtonWhitePlus"'
        style="float:right;" onclick="console.log('+ was clicked')"></span>
</div>

编辑

有没有一种方法可以通过编程的方式来解决这个问题,或者在什么地方我可以找到一些关于这里发生了什么的澄清。我以编程的方式创建它们已经有很长时间了,我相信这是一种比模板制作优越得多的方法。处理框架的困难在于知道要搜索的关键字。我相信,您的答案可以通过学习Dojo WidgetBase和任何其他使用“Widget”一词的工具找到

好的开始就在这里。要成功使用Dojo小部件,您还需要:

  • 生命周期的概念。生命周期注入点将允许您使用JavaScript本机API修改模板的DOM树,这样您就不必在所有属性中使用数据dojo。您将在buildRendering阶段将节点捕获为私有类属性,以便可以将构造函数参数应用于在父级实例化期间传递的节点。最后,根据是否需要专门处理子组件,您将在postreate()或startup()中返回最终DOM
  • 事件的概念。这就是您需要以编程方式执行的widgetInstance.on(“someEvent”,eventHandler)
我在templateString的HTML标记中使用的唯一自定义属性是data dojo attach point和data dojo attach event。这些方法非常方便,节省了大量时间,并且使数据绑定不太容易出现错误,可以自动将小部件的类属性与标记中的值连接起来。尽管您也可以使用innerHTML以编程方式完成这些工作,但在我看来,大量繁琐的样板代码是不值得的

阅读该教程,如果最后你不理解某些内容,一定要让我知道,我会详细说明(我不是那种只通过链接发送询问者而不费心详细说明材料的人)