Question

我试图通过包含dojo 1.10的CDN使用dgrid，但它不起作用。

<script
src="http://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dojo/dojo.js"
data-dojo-config="async: true, parseOnLoad:true"></script>
<script>
require([ "dgrid/Grid", "dojo/domReady!" ], function(Grid) {
    var grid = new Grid({
        columns : {
            serverName : "Server Name",
            serviceName : "Service Name",
            available : "Verfügbar"
        }

    }, "grid");
});

问题出在哪里？通过加载网站我得到一个Err：scriptErr。

Answer 1

这是一个非常完整的示例。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Tutorial: Hello dgrid!</title>
    <script 
        src='//ajax.googleapis.com/ajax/libs/dojo/1.10.1/dojo/dojo.js' 
        data-dojo-config="async: true, parseOnLoad: true">
    </script>

    <script>
        require({
            packages: [{
                name: 'dgrid',
                location: '//cdn.rawgit.com/SitePen/dgrid/v0.3.15'
            }, {
                name: 'xstyle',
                location:'//cdn.rawgit.com/kriszyp/xstyle/v0.2.1'
            }, {
                name: 'put-selector',
                location: '//cdn.rawgit.com/kriszyp/put-selector/v0.3.5'
            }]
            },[
                'dgrid/Grid',
                'dojo/domReady!'
            ], function (Grid) {

            var data = [
                { first: 'Bob', last: 'Barker', age: 89 },
                { first: 'Vanna', last: 'White', age: 55 },
                { first: 'Pat', last: 'Sajak', age: 65 }
            ];

            var grid = new Grid({
                columns: {
                    first: 'First Name',
                    last: 'Last Name',
                    age: 'Age'
                }
            }, 'grid');

            grid.renderArray(data);
        });
    </script>
</head>
<body>
    <div id="grid"></div>
</body>
</html>

Answer 2

dgrid及其依赖项不会托管在Google CDN上，更不用说作为Dojo的兄弟，而且您似乎没有任何packages配置来在其他地方选择dgrid，xstyle和put-selector

虽然dgrid没有发布到任何CDN，但RawGit现在有一个他们正在测试的功能，它能够在MaxCDN上缓存github资源。您可以使用以下配置为dgrid利用此功能：

var dojoConfig = {
    async: true,
    packages: [{
        name: 'dgrid',
        location: '//cdn.rawgit.com/SitePen/dgrid/v0.3.15'
    }, {
        name: 'xstyle',
        location:'//cdn.rawgit.com/kriszyp/xstyle/v0.2.1'
    }, {
        name: 'put-selector',
        location: '//cdn.rawgit.com/kriszyp/put-selector/v0.3.5'
    }]
};

当然，请记住，RawGit的CDN服务无法保证100％正常运行时间，因此只能用于原型设计，而不能用于生产，但理想情况下，您应该为生产推出自定义构建。

Answer 3

你需要在身体中放置一个div标签。

<body>
    <div id="grid"></div>
</body>

Answer 4

您是否尝试过调用grid.renderArray（数据）？

这是一个完整的例子

require(["dgrid/Grid", "dojo/domReady!"], function(Grid){
    var data = [
        { first: "Bob", last: "Barker", age: 89 },
        { first: "Vanna", last: "White", age: 55 },
        { first: "Pat", last: "Sajak", age: 65 }
    ];
 
    var grid = new Grid({
        columns: {
            first: "First Name",
            last: "Last Name",
            age: "Age"
        }
    }, "grid");
    grid.renderArray(data);
});

更多示例here

使用Dojo CDN的dgrid / Grid

4 个答案: