jquery - dashcode:如何添加/删除列表中的项目？列表在视觉上不刷新

Question

我正在开发一些小部件。它不使用任何网络服务作为数据源。我使用 jQuery 从普通网页解析一些数据，并希望将此数据显示为破折号列表。我按照 Dashcode 中的 listDataSource 示例代码进行操作。

var listDataSource = {
  _rowData: ['Item 1', 'Item 2', 'Item 3'],
  numberOfRows: function() {
      alert("Row data now is: "+this._rowData);
      alert("number of rows: "+this._rowData.length);
      return this._rowData.length;
},
prepareRow: function(rowElement, rowIndex, templateElements) {
    if (templateElements.rowLabel) {
        templateElements.rowLabel.innerText = this._rowData[rowIndex];
    }
    rowElement.ondblclick = function(event) {
        // Do something interesting
        alert("Row "+rowIndex);
    };
}
};

在属性检查器中，我选择了动态数据类型并选择了此 listDataSource 作为数据源。然后，我通过这种方式向 listDataSource 的 _rowData 添加一项:

listDataSource._rowData.push("New Item 4");

并以这种方式重新加载我的列表:

var mylist = document.getElementById("list").object;    
mylist.reloadData();

我知道，在我添加新项目(通过警报消息)后，将调用 numberOfRows 和prepareRow 函数。警报打印 _rowData 并按预期添加新项目。但我的小部件中的列表没有刷新!为什么？我实在想不通。是否有一些函数 reloadUI() 或者其他什么？如果您现在解决了我的问题，请让我上路。谢谢!

Answer 1

我自己发现了一个丑陋的黑客行为。如果 reloadData() 被调用两次 - UI 中的列表将按预期刷新。

另一个解决方案是使用全局变量并在 reloadData() 之前设置它

var myData['Item 1', 'Item 2', 'Item 3'];

var listDataSource = {
  _rowData: myData,
  numberOfRows: function() {
  alert("Row data now is: "+this._rowData);
  alert("number of rows: "+this._rowData.length);
  return this._rowData.length;
},
prepareRow: function(rowElement, rowIndex, templateElements) {
if (templateElements.rowLabel) {
    templateElements.rowLabel.innerText = this._rowData[rowIndex];
}
rowElement.ondblclick = function(event) {
    // Do something interesting
    alert("Row "+rowIndex);
};
}
};

然后

myData.push("Item 4");

并将新的数据数组设置为列表，然后重新加载它:

var mylist = document.getElementById("list").object;    
mylist.setDataArray(myData);
mylist.reloadData();

但是这个解决方案禁用了 rowElement 上的回调函数

alert("Row "+rowIndex);

设置新的dataArray后不起作用，所以我选择双重reloadData hack:

var mylist = document.getElementById("list").object;    
mylist.reloadData();
mylist.reloadData();