EXT4.0学习笔记：Array Grid入门

"这篇文档是关于EXT 4.0的学习笔记，主要讲解了Array Grid的使用，适合初学者。作者提到网上EXT的中文资料多为2.2版本，而他直接学习4.0版本，并分享了他的学习过程。笔记中可能不包含所有对象属性的详细解释，但会基于EXT 4.0的自带示例进行讲解，鼓励读者查阅API获取更深入的知识。笔记还涉及EXT环境的配置问题，包括EXT 4.0的下载地址和样式与JS的配置建议。" EXT JS是一个流行的JavaScript库，用于构建富客户端的Web应用，其4.0版本带来了许多改进和新特性。Array Grid是EXT JS中的一种基本组件，用于展示结构化的数据，通常以表格形式呈现。在EXT 4.0中，Array Grid允许开发者快速地展示一维数组数据，提供了基础的数据操作和交互功能。 配置EXT 4.0环境是初学者面临的一个挑战。首先，可以从官方网址下载EXT 4.0的完整包，这里推荐使用GPL许可证的版本。为了确保样式正确显示，应将`resources`文件夹中的所有内容复制到项目目录中。JS配置方面，`bootstrap.js`、`ext-all-debug.js`和`ext-all.js`应放在同一目录下，因为`bootstrap.js`会根据环境动态加载`ext-all-debug.js`或`ext-all.js`，这取决于是否处于开发模式。 在EXT 4.0中，`bootstrap.js`检测当前环境是否为本地文件系统（file协议），如果是，则设置`isDevelopment`为`true`，这样会加载带调试信息的`ext-all-debug.js`，方便开发时排查问题。在生产环境中，通常会使用压缩并优化过的`ext-all.js`，以提高性能。 Array Grid的创建涉及以下几个关键点： 1. **数据源**：Array Grid的数据通常是一个JavaScript数组，每个元素代表一行数据，数组的每一项又是一个包含列值的对象。 2. **Column Model**：定义列的元数据，包括列名、宽度、对齐方式、是否可排序等属性。 3. **Store**：存储数据的地方，EXT 4.0中通常使用`Ext.data.ArrayStore`，它从给定的数组加载数据。 4. **Grid Panel**：实际显示表格的组件，通过`Ext.grid.Panel`创建，需要配置store和column model。 5. **Rendering**：EXT会自动处理数据显示，包括类型转换和格式化。 在实际应用中，Array Grid可能需要扩展以实现更复杂的功能，如分页、过滤、编辑等。EXT 4.0提供了一系列的API和插件来支持这些需求。 这篇学习笔记旨在帮助初学者快速上手EXT 4.0的Array Grid，通过实践和示例，读者可以逐步理解如何配置EXT环境，创建和定制Array Grid，以及如何利用EXT的API进行数据操作和交互。对于想要深入了解EXT的开发者，查阅官方文档和API是必不可少的步骤。