replace the diffDOM lib
This commit is contained in:
kmdjs
parent
0ab6044cdb
commit
2c31ab88d5
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -55,26 +55,9 @@
|
|||
}, this.option);
|
||||
this.pageNum = Math.ceil(this.option.total / this.option.pageSize);
|
||||
},
|
||||
onRefresh: function () {
|
||||
if (this.option.currentPage > 0) {
|
||||
this.prev.addEventListener("click", function (evt) {
|
||||
this.option.currentPage--;
|
||||
evt.preventDefault();
|
||||
}.bind(this), false);
|
||||
}
|
||||
if (this.option.currentPage < this.pageNum - 1) {
|
||||
this.next.addEventListener("click", function (evt) {
|
||||
this.option.currentPage++;
|
||||
evt.preventDefault();
|
||||
}.bind(this), false);
|
||||
}
|
||||
|
||||
this.links = this.node.querySelectorAll(".link");
|
||||
var self = this;
|
||||
util.addEvent(this.links, "click", function (evt) {
|
||||
self.option.currentPage = parseInt(this.getAttribute("data-pageIndex"));
|
||||
evt.preventDefault();
|
||||
});
|
||||
goto: function (index,evt) {
|
||||
evt.preventDefault();
|
||||
this.option.currentPage=index;
|
||||
},
|
||||
onOptionChange: function (prop, value, oldValue, path) {
|
||||
if (prop === "currentPage") {
|
||||
|
|
@ -130,22 +113,20 @@
|
|||
if (this.option.currentPage === 0) {
|
||||
return '<span nc-id="prev" class="current prev">{{prevText}}</span>';
|
||||
}
|
||||
return '<a nc-id="prev" href="{{linkTo}}" class="prev">{{prevText}}</a>';
|
||||
return '<a nc-id="prev" onclick="goto('+(this.option.currentPage-1)+',event)" href="{{linkTo}}" class="prev">{{prevText}}</a>';
|
||||
},
|
||||
getNext: function () {
|
||||
if (this.option.currentPage === this.pageNum - 1) {
|
||||
return '<span nc-id="next" class="current next">{{nextText}}</span>';
|
||||
}
|
||||
return '<a nc-id="next" href="{{linkTo}}" class="next">{{nextText}}</a>';
|
||||
return '<a nc-id="next" onclick="goto('+(this.option.currentPage+1)+',event)" href="{{linkTo}}" class="next">{{nextText}}</a>';
|
||||
},
|
||||
getItem: function (pageIndex, text) {
|
||||
if (this.option.currentPage === pageIndex) {
|
||||
return '<span class="current">' + text + '</span>';
|
||||
}
|
||||
return '<a class="link" data-pageIndex="' + pageIndex + '" href="{{linkTo}}">' + text + '</a>';
|
||||
return '<a class="link" onclick="goto('+pageIndex+',event)" data-pageIndex="' + pageIndex + '" href="{{linkTo}}">' + text + '</a>';
|
||||
}
|
||||
},{
|
||||
diff:false
|
||||
})
|
||||
new Pagination({
|
||||
total: 100,//总个数80
|
||||
|
|
|
|||
1500
src/diffDOM.js
1500
src/diffDOM.js
File diff suppressed because it is too large
Load Diff
|
|
@ -47,9 +47,10 @@ Nuclear._mixObj = function (obj) {
|
|||
var old = this._nuclearOption;
|
||||
if (old !== value) {
|
||||
this._nuclearOption = value;
|
||||
this.onOptionChange && this.onOptionChange('_nuclearOption', value, old, '');
|
||||
this._nuclearObserver();
|
||||
|
||||
if( this._nuclearRenderInfo){
|
||||
this.onOptionChange && this.onOptionChange('_nuclearOption', value, old, '');
|
||||
this._nuclearObserver();
|
||||
this._nuclearRenderInfo.data = this.option;
|
||||
this.refresh();
|
||||
}
|
||||
|
|
@ -179,13 +180,20 @@ Nuclear._mixObj = function (obj) {
|
|||
this.node = null;
|
||||
this.HTML = "";
|
||||
} else {
|
||||
var newNode = Nuclear.str2Dom(this._nuclearWrap(Nuclear.render(Nuclear._fixEvent(Nuclear._fixTplIndex(item.tpl), this._ncInstanceId), item.data)));
|
||||
if(this._nuclearDiffDom) {
|
||||
Nuclear.diffDOM.apply(this.node, Nuclear.diffDOM.diff(this.node, newNode));
|
||||
}else {
|
||||
item.parent.replaceChild(newNode, this.node);
|
||||
this.node = newNode;
|
||||
}
|
||||
// var newNode = Nuclear.str2Dom(this._nuclearWrap(Nuclear.render(Nuclear._fixEvent(Nuclear._fixTplIndex(item.tpl), this._ncInstanceId), item.data)));
|
||||
//if(this._nuclearDiffDom) {
|
||||
// Nuclear.diffDOM.apply(this.node, Nuclear.diffDOM.diff(this.node, newNode));
|
||||
//}else {
|
||||
// item.parent.replaceChild(newNode, this.node);
|
||||
// this.node = newNode;
|
||||
//}
|
||||
if (this._nuclearDiffDom) {
|
||||
Nuclear.setDOM(this.node, this._nuclearWrap(Nuclear.render(Nuclear._fixEvent(Nuclear._fixTplIndex(item.tpl), this._ncInstanceId), item.data)));
|
||||
} else {
|
||||
var newNode = Nuclear.str2Dom(this._nuclearWrap(Nuclear.render(Nuclear._fixEvent(Nuclear._fixTplIndex(item.tpl), this._ncInstanceId), item.data)));
|
||||
item.parent.replaceChild(newNode, this.node);
|
||||
this.node = newNode;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
//第一次渲染
|
||||
|
|
@ -203,8 +211,6 @@ Nuclear._mixObj = function (obj) {
|
|||
|
||||
this._mixNode();
|
||||
this._nuclearSetStyleData();
|
||||
//nc-refresh的比较常见的应用场景就是文本框输入的时候不刷新自己，刷新会导致失去焦点。nc-refresh也能用于性能优化
|
||||
item.refreshPart = this.node.querySelectorAll('*[nc-refresh]');
|
||||
this.HTML = this.node.outerHTML;
|
||||
|
||||
|
||||
|
|
@ -309,26 +315,11 @@ Nuclear._mixObj = function (obj) {
|
|||
}
|
||||
|
||||
obj._nuclearLocalRefresh = function () {
|
||||
var item = this._nuclearRenderInfo, rpLen = item.refreshPart.length;
|
||||
var item = this._nuclearRenderInfo;
|
||||
item.tpl = this._nuclearTplGenerator();
|
||||
if (rpLen > 0) {
|
||||
var parts = Nuclear.str2Dom(this._nuclearWrap(Nuclear.render(Nuclear._fixEvent(Nuclear._fixTplIndex(item.tpl), this._ncInstanceId), item.data))).querySelectorAll('*[nc-refresh]');
|
||||
for (var j = 0; j < rpLen; j++) {
|
||||
var part = item.refreshPart[j];
|
||||
//执行完replaceChild，原part的parentNode就为null,代表其已经被子节点替换掉了
|
||||
part.parentNode&&part.parentNode.replaceChild(parts[j], part);
|
||||
|
||||
}
|
||||
item.refreshPart = parts;
|
||||
this._mixNode();
|
||||
|
||||
this.HTML = this.node.outerHTML;
|
||||
|
||||
this._nuclearFix();
|
||||
if (this.onRefresh) this.onRefresh();
|
||||
} else {
|
||||
this._nuclearRender(item);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue