我有一个列表视图，我从api调用中收到的数据按顺序说出
1
2
3
4
5
点击一个项目3后，我进行api调用，按顺序提供数据
3
1
2
4
5
我需要显示相同的内容。但我的列表视图目前填充如
3
1
3
4
5
我检查了显示listview项目数据的日志，并以正确的顺序打印
ListView {
id: contactListView
dataModel: contactsData
listItemComponents: [
ListItemComponent
{
id: homeListComponent
type: "item"
CustomListItemHomePage
{
id: listCell
background: ListItemData.colors
text: ListItemData.name;
onClicked: {
listCell.ListItem.view.fetchListFromLV();
}
}
}
]
function fetchListFromLV()
{
//some codes that makes the api call here
}
}
attachedObjects: [
GroupDataModel {
id: contactsData
sortingKeys: [ "last" ]
grouping: ItemGrouping.None
},
Communication {
id: requestPost
onComplete: {
//gets the api call response here
var response = JSON.parse(info);
console.log(response);
if (response.hasOwnProperty('contacts'))
{
contactsData.clear();
//contactListView.dataModelChanged(contactsData);
var contacts = response["contacts"];
for (var cntNames in contacts)
{
contactsData.insert({
name: contacts[cntNames].toString(),
last: contactsData.size(),
colors: setBgColor(contactsData.size())
})
}
}
//This log prints data in correct order i.e 3 1 2 4 5 but the data displayed in list view prints in wrong order 3 1 3 4 5
for (var i=0;i<contactsData.size();i++)
{
console.log(contactsData.data([i]).name);
}
}
]
答案 0 :(得分：1)
**Follow This Code**
import bb.cascades 1.2
Page {
onCreationCompleted: {
fillGroupDataModel()
}
Container {
ListView {
id: contactListView
dataModel: contactsData
listItemComponents: [
ListItemComponent {
id: homeListComponent
type: "item"
Container {
horizontalAlignment: HorizontalAlignment.Fill
verticalAlignment: VerticalAlignment.Fill
background: ListItemData.color_default_bg
Container {
horizontalAlignment: HorizontalAlignment.Fill
verticalAlignment: VerticalAlignment.Center
topPadding: 10
bottomPadding: 10
leftPadding: 10
rightPadding: 10
layout: StackLayout {
orientation: LayoutOrientation.LeftToRight
}
Label {
id: mLableColorId
text: ListItemData.color_id
verticalAlignment: VerticalAlignment.Center
}
Label {
id: mLableColorName
text: ListItemData.color_name
verticalAlignment: VerticalAlignment.Center
}
}
Divider {
horizontalAlignment: HorizontalAlignment.Fill
}
}
}
]
onTriggered: {
var selectedItem = dataModel.data(indexPath);
var selectedColor = selectedItem.color_code
var count = contactListView.dataModel.childCount(0)
for (var i = 0; i < count; i ++) {
var tempImdexPath = [ i ]
var selectedItem = dataModel.data(tempImdexPath);
selectedItem.color_default_bg = selectedColor
contactListView.dataModel.updateItem(tempImdexPath, selectedItem);
}
}
}
}
function fillGroupDataModel() {
contactsData.clear()
contactsData.insert({
"color_id": 1,
"color_code": Color.Blue,
"color_name": "Blue",
"color_default_bg": Color.White
});
contactsData.insert({
"color_id": 2,
"color_code": Color.Green,
"color_name": "Grean",
"color_default_bg": Color.White
});
contactsData.insert({
"color_id": 3,
"color_code": Color.Red,
"color_name": "Red",
"color_default_bg": Color.White
});
contactsData.insert({
"color_id": 4,
"color_code": Color.Gray,
"color_name": "Gray",
"color_default_bg": Color.White
});
contactsData.insert({
"color_id": 5,
"color_code": Color.Cyan,
"color_name": "Cyan",
"color_default_bg": Color.White
});
}
attachedObjects: [
GroupDataModel {
id: contactsData
sortingKeys: [ "color_id" ]
sortedAscending: true
grouping: ItemGrouping.None
}
]
}