extjs 中不显示的简单 HTML 数据答案

【问题标题】：Simple HTML data not displayed in extjsextjs 中不显示的简单 HTML 数据
【发布时间】：2023-03-08 22:55:02
【问题描述】：

我有一个 XTemplate 来显示 html 数据，如下所示

var headerTmp = new Ext.XTemplate(
'<br><br><br>',
'<div class="contact-display-container" style="height:100px; width:400px">',
'<div style="font-size:12px; left:15px">Hello </div>',
'</div>',
'<br><br><br>'
);

我指的是数据视图中的数据

var dataView1 = new Ext.DataView({
autoScroll: false,
tpl: headerTmp,
itemSelector: 'div.contact-display-container'
});

我正在尝试在窗口中显示数据

var win = new Ext.Window({
height:700,
width:700,
border:false,
modal:true,
title: 'Review Contact Information',
items:[{
    layout : 'vbox',
    items  : [dataView1]
}],
    buttons:[{
                text: 'Cancel',
                handler:function(){
                win.close();
                }
              }]
            });

win.show();

但是数据“Hello”没有显示在窗口上。你能告诉我哪里出错了。在此先感谢:)

【问题讨论】：

标签： extjs3 dataview

【解决方案1】：

应将数据视图绑定到商店的实例。尝试将商店配置添加到您的数据视图。
您在窗口中过度嵌套了项目。您应该将 dataView 作为子项直接添加到您的窗口中。如果您需要额外的父级面板，请将其布局更改为 fit 或如果您想将其保留为 vbox，请将 flex 配置添加到数据视图。

这是一个工作示例： http://jsfiddle.net/KUqM9/419/

【讨论】：