如何编写我的小部件而不用在dojo.ready中声明它的代码

How to write my widget without declaring it's code in dojo.ready

本文关键字：ready dojo 声明 代码 我的 何编写 小部      更新时间：2023-09-26

使用一些教程，我编写了简单的小部件，但它导致错误"declare customwidget "。TestDijit: mixin #0是未知的":

//test.html 

<title>Test</title>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.0/dojo/dojo.xd.js" djConfig="parseOnLoad:true">
</script>
<script type="text/javascript" src="Test.js"> </script>
<script type="text/javascript">
dojo.require("customwidget.TestWidget");
</script>
</head>
<body>
<div dojoType='customwidget.TestWidget'/>
</body>

//. js

dojo.provide('customwidget.TestDijit')
dojo.require('dijit._Widget');
dojo.require('dijit._Templated');
dojo.require('dojo.caсhe');
dojo.declare("customwidget.TestDijit",  [dijit._Widget, dijit._Templated],
{
    //can't use  dojo.caсhe('customwidget.template', 'testdijit.html') I don't know why
    templatePath : "",
    widgetsInTemplate : true,
    lang : 'EN',
    postCreate: function(args, frag)
    {
        this.inherited('postCreate', arguments);
    },
    clickEvent : function()
    {
        alert("Button Click event");
    }
});
//testdijit.html 

<div id="${id}">
<input dojoattachevent="onClick: clickEvent" dojotype="dijit.form.Button" label="Search" />
</div>

我发现，如果我把所有小部件的代码在dojo。准备好函数，然后它就可以工作了(感谢本文)。当然，我不想在ready函数中找到我所有的js代码。在上述文章的代码示例中，作者编写了// Future tutorials will explain how to properly separate this out into its own file.你知道怎么解决这个问题吗?

p。你也知道我为什么不会柔道吗?现金在这js代码?

UPD:加载跨域资源的问题。这里有类似的讨论，但我不明白如何解决这个问题。我可以在本地存储dojo，但在这种情况下，它找不到我的TestWidget.js -我不知道如何指定路径到我的脚本。如果我使用baseUrl它会说"无法加载'dojo。_base。lang' "最后一次尝试'./_base/lang.js'".

测试/test.html 

<!DOCTYPE html> 
<head>
<title>Test</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/resources/dojo.css"> 
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css"> 
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojox/grid/resources/Grid.css"> 
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojox/grid/resources/claroGrid.css"> 
<link rel="stylesheet" href="css/layout.css"> 
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.0/dojo/dojo.xd.js" 
    djConfig="parseOnLoad:true, baseUrl: './'">
</script>
<script type="text/javascript">
    dojo.require("customwidget.TestWidget");
</script>
</head>
<body class="claro">
    <div dojoType='js.Test'>
    </div>
</body>
测试/customwidget/TestWidget.js 

dojo.provide('customwidget.TestWidget')
dojo.require('dijit._Widget');
dojo.require('dijit._Templated');
dojo.require("dijit.form.Button");
//dojo.require('dojo.cache');
dojo.declare("customwidget.TestWidget",  [dijit._Widget, dijit._Templated],
{
    templatePath : "",//dojo.cache('customwidget.template', 'testdijit.html'),
    widgetsInTemplate : true,
    lang : 'EN',
    postCreate: function(args, frag)
    {
        this.inherited('postCreate', arguments);
    },
    clickEvent : function()
    {
        alert("Button Click event");
    }
});

首先有几件事(但我猜这些主要是你在这里发帖时犯的拼写错误)。

  • dojo.cashe应该是dojo.cache
  • 你似乎把customwidget.TestWidget和customwidget.TestDijit混在一起了
  • 如果你想在你的小部件的模板中使用dijit.form.Button，你必须要求它

现在说更重要的事情。当你使用<脚本>标记来包含js文件，Dojo在做其他事情之前不会考虑加载需求。这就是为什么你得到mixin未知，因为在调用dojo.declare时，dijit._Templated类还没有加载。

但是，如果您使用dojo。需要加载您的小部件/模块时，dojo确保满足需求(所有dojo。Test.js中的require语句)在尝试使用它们之前已经加载完成。因此，删除Test.js的

相关文章：