如何在EXT.JS中建立一个带有字符计数器和最大长度的文本区？

在EXT.JS中，可以通过使用TextField组件来建立一个带有字符计数器和最大长度的文本区。

首先，需要引入EXT.JS的库文件，确保在页面中正确加载了EXT.JS的资源文件。

然后，在页面中创建一个TextField组件，并设置相应的配置项。以下是一个示例代码：

Ext.create('Ext.form.Panel', {
    renderTo: Ext.getBody(),
    items: [{
        xtype: 'textareafield',
        fieldLabel: '文本区',
        maxLength: 100, // 设置最大长度为100个字符
        enforceMaxLength: true, // 开启最大长度限制
        listeners: {
            change: function(field, newValue) {
                var maxLength = field.maxLength;
                var currentLength = newValue.length;
                var counter = Ext.getCmp('counter');
                counter.setText(currentLength + '/' + maxLength); // 更新字符计数器的文本
            }
        }
    }, {
        xtype: 'label',
        id: 'counter',
        text: '0/100' // 初始字符计数器的文本
    }]
});

在上述代码中，我们创建了一个form.Panel，并在其中添加了一个textareafield作为文本区。通过设置maxLength属性，可以限制文本区的最大长度为100个字符。enforceMaxLength属性设置为true，表示开启最大长度限制。

同时，我们为textareafield添加了一个change事件的监听器。当文本区的内容发生变化时，change事件会被触发，我们可以在监听器中更新字符计数器的文本。通过获取当前文本的长度和最大长度，然后更新字符计数器的文本。

最后，我们在form.Panel中添加了一个label组件作为字符计数器，并设置了一个id属性为'counter'，以便在监听器中通过该id获取到字符计数器的引用。

这样，就实现了在EXT.JS中建立一个带有字符计数器和最大长度的文本区。