extjs Cannot read property 'dom' of null

最新推荐文章于 2025-06-24 10:04:04 发布

woko_mew

最新推荐文章于 2025-06-24 10:04:04 发布

阅读量1.4w

点赞数 1

CC 4.0 BY-SA版权

文章标签： EXTJS

本文链接：https://blog.youkuaiyun.com/u012242610/article/details/14228523

本文介绍了一个常见的EXTJS错误Cannotreadproperty'dom'ofnull的原因及解决方案。该错误通常由于HTML或JSP文件中缺少必要的元素导致。通过确保页面中存在指定ID的DOM元素可以避免此类问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如果你的EXTJS报错： Cannot read property 'dom' of null，那就有可能是因为你的HTML或者JSP文件中的BODY标签里面少了个东西比如代码是：

<html>
<head>
    <title>Hello Ext</title>
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">  
    <script type="text/javascript" src="extjs/ext-all.js"></script>  
    
</head>
<body >
  <div id="example-grid"></div>
</body>
</html>
 <script type="text/javascript">
Ext.require([
    'Ext.data.*',
    'Ext.grid.*'
]);

Ext.onReady(function(){
    Ext.define('Book',{
        extend: 'Ext.data.Model',
        proxy: {
            type: 'ajax',
            reader: 'xml'
        },
        fields: [
            // set up the fields mapping into the xml doc
            // The first needs mapping, the others are very basic
            {name: 'Author', mapping: '@author.name'},
            'Title', 'Manufacturer', 'ProductGroup'
        ]
    });

    // create the Data Store
    var store = Ext.create('Ext.data.Store', {
        model: 'Book',
        autoLoad: true,
        proxy: {
            // load using HTTP
            type: 'ajax',
            url: 'sampledata-sheldon.xml',
            // the return will be XML, so lets set up a reader
            reader: {
                type: 'xml',
                // records will have an "Item" tag
                record: 'Item',
                idProperty: 'ASIN',
                totalRecords: '@total'
            }
        }
    });

    // create the grid
    Ext.create('Ext.grid.Panel', {
        store: store,
        columns: [
            {text: "Author", flex: 1, dataIndex: 'Author'},
            {text: "Title", width: 180, dataIndex: 'Title'},
            {text: "Manufacturer", width: 115, dataIndex: 'Manufacturer'},
            {text: "Product Group", width: 100, dataIndex: 'ProductGroup'}
        ],
        renderTo:'example-grid',
        width: 540,
        height: 200
    });
});
</script>

如果这个代码里面没有id为'example-grid'的DIV的话会报错：Cannot read property 'dom' of null。加上后就不会报这样的错误了！