0
我有一个配置文件主页视图(Home2)。在这个视图中,想要显示顶部停靠的标题栏,用户配置文件信息和用户帖子。ExtJs DataView vbox中的高度
Ext.define('FreescribbleApp.view.Home2', {
extend: 'Ext.Panel',
xtype: 'homepage2',
config: {
title: 'Home',
iconCls: 'home',
styleHtmlContent: true,
scrollable: true,
items:[
{
xtype: 'titlebarview'
},
{
xtype: 'userinfoview',
itemId: 'userInfoWrapper',
height: 150
},
{
itemId: 'homeStage',
autoScroll: true
}
]
}
});
我也有一个数据视图:
Ext.define('FreescribbleApp.view.PostList', {
extend: 'Ext.dataview.DataView',
xtype: 'postlist',
config: {
scrollable: false,
defaultType: 'postitem',
useComponents: true
}
});
列出DataItems:
Ext.define('FreescribbleApp.view.PostItem', {
extend: 'Ext.dataview.component.DataItem',
xtype: 'postitem',
requires: ['Ext.field.Text'],
config: {
style: 'background-color: #f00',
height: 100,
styleHtmlContent: false,
authorName: {
height: 30,
style: 'background-color: #0f0'
},
dataMap: {
getAuthorName: {
setHtml: 'userName'
}
},
},
applyAuthorName: function(config) {
return Ext.factory(config, Ext.Component, this.getAuthorName());
},
updateAuthorName: function(newAuthorName, oldAuthorName) {
if (newAuthorName) {
this.add(newAuthorName);
}
if (oldAuthorName) {
this.remove(oldAuthorName);
}
}
});
在我的HomeController
我创建了一个PostStore,一些职位填满它,并添加到数据视图。之后,我将DataView添加到Home2-View Element HomeStage:
var postStore = Ext.create('FreescribbleApp.store.PostStore', {
params: {
user: localStorage.getItem('userId'),
token: localStorage.getItem('token'),
target: localStorage.getItem('userName')
}
});
postStore.load();
postStore.on('load', function(){
var currentView = Ext.create('FreescribbleApp.view.PostList');
currentView.setStore(postStore);
homeStage.add(currentView);
});
直到我设置了DataView的高度后才能看到任何项目。这是一个常见问题,在我的情况下发髻我不能设置我的HomeStage'适合',因为它只是Home2的一部分,并且项目userinfo应该与帖子滚动。那么我怎样才能动态地设置我的DataView的大小呢?
我也在我的Sencha debuger中看到Chrome在我的DataView-List和我的DataItems之间是一个容器,里面有所有物品的权利高度。我可以只获取这个容器的大小并为我的DataView设置我的大小吗?它会起作用吗?它会是一个好的做法吗?