Skip to content

Commit 57c37da

Browse files
RubyLouvreRubyLouvre
committed
完成ms-repeat
1 parent 66d5cda commit 57c37da

12 files changed

+112
-507
lines changed

‎avalon.js

Lines changed: 14 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1976,9 +1976,9 @@ function rejectDisposeQueue(data) {
19761976
}
19771977

19781978
function disposeData(data) {
1979-
console.log("dispose")
1980-
console.log(data.type)
1981-
console.log(data.element)
1979+
// console.log("dispose")
1980+
// console.log(data.type)
1981+
// console.log(data.element)
19821982
data.element = null
19831983
data.rollback && data.rollback()
19841984
for (var key in data) {
@@ -2606,7 +2606,7 @@ var updateDTree = {
26062606
delete vnode.ifData
26072607
},
26082608
text: function (vnode, parent) {
2609-
console.log("text")
2609+
26102610
var rnodes = parent.childNodes
26112611
var vnodes = vnode.childNodes
26122612
traverseNodeBetweenSignature(vnodes, "v-text", {
@@ -2633,7 +2633,6 @@ var updateDTree = {
26332633
parent.removeChild(real)
26342634
real = rnodes[i]
26352635
}
2636-
26372636
},
26382637
step: function (virtual, i) {
26392638
var real = rnodes[i]
@@ -2663,14 +2662,14 @@ var updateDTree = {
26632662
})
26642663
},
26652664
repeat: function (vnode, parent) {
2666-
console.log("repeat")
2665+
avalon.log("repeat")
26672666
var rnodes = parent.childNodes
26682667
var vnodes = vnode.childNodes
26692668

26702669
var collect = false, token
2671-
var keys = {}, repeatRange = [], index = 0
2670+
var keys = {}, newRepeatNodes = [], oldRepeatNodes = [], index = 0
26722671
//收集从<!--v-repeat1213--> 到<!--v-repeat1213:end-->之间的节点,包括第一个<!--v-repeat1213-->
2673-
//将它们放进repeatRange,并在这过程中构建keys对象
2672+
//将它们放进newRepeatNodes,并在这过程中构建keys对象
26742673
for (var i = 0, virtual; virtual = vnodes[i]; i++) {
26752674
if (!collect && virtual.nodeType === 8 && /^v-(repeat|with|each)/.test(virtual.nodeValue)) {
26762675
token = virtual.nodeValue + ":end"
@@ -2688,12 +2687,11 @@ var updateDTree = {
26882687
keys[ virtual.nodeValue] = [index]
26892688
}
26902689
}
2691-
repeatRange[index] = virtual
2690+
newRepeatNodes[index] = virtual
26922691
index++
26932692
}
26942693
}
2695-
var older = []
2696-
collect = false
2694+
//对真实DOM根据keys给出的顺序进行重排，并删掉没用的旧节点，与生成缺少的新节点
26972695
for(var i = 0, node; node = rnodes[i]; i++){
26982696
if ( node.nodeType === 8 && /^v-(repeat|with|each)/.test(node.nodeValue)) {
26992697
token = node.nodeValue + ":end"
@@ -2707,80 +2705,26 @@ var updateDTree = {
27072705
//收集符合要求的真实DOM
27082706
parent.removeChild(node)
27092707
if (node.nodeType === 1) {
2710-
older[keys[node.vid]] = node
2708+
oldRepeatNodes[keys[node.vid]] = node
27112709
} else {
27122710
if (keys[node.nodeValue]) {
2713-
older[ keys[node.nodeValue].shift()] = node
2711+
oldRepeatNodes[ keys[node.nodeValue].shift()] = node
27142712
}
27152713
}
27162714
}
27172715
var fragment = DOC.createDocumentFragment()
2718-
for( i = 0; node = repeatRange[i];i ++){
2719-
if(older[i]){
2720-
fragment.appendChild(older[i])
2716+
for( i = 0; node = newRepeatNodes[i];i ++){
2717+
if(oldRepeatNodes[i]){
2718+
fragment.appendChild(oldRepeatNodes[i])
27212719
}else{
27222720
fragment.appendChild(new DNode(node))
27232721
}
27242722
}
27252723
parent.insertBefore(fragment,end)
27262724
break
27272725
}
2728-
27292726
}
27302727

2731-
2732-
2733-
// callbacks = callbacks || {}
2734-
// for (var i = 0, virtual; virtual = vnodes[i]; i++) {
2735-
// if (!collect && virtual.nodeType === 8 && virtual.nodeValue.indexOf("v-repeat") === 0) {
2736-
//
2737-
// token = virtual.nodeValue + ":end"
2738-
// collect = true
2739-
// continue
2740-
// } else if (collect && virtual.nodeType === 8 && virtual.nodeValue === token) {
2741-
// // comments.push(el)
2742-
// collect = false
2743-
// while (real && (real.nodeType !== 8 || real.nodeValue !== token)) {
2744-
// parent.removeChild(real)
2745-
// real = rnodes[i]
2746-
// }
2747-
// console.log("end")
2748-
// // callbacks.end && callbacks.end(el, i)
2749-
// continue
2750-
// }
2751-
// if (collect) {
2752-
// var real = rnodes[i]
2753-
// if (virtual.nodeType !== real.nodeType) {
2754-
// parent.insertBefore(new DNode(virtual), real)
2755-
// } else {
2756-
// switch (virtual.nodeType) {
2757-
// case 1:
2758-
// if (real.nodeName !== virtual.nodeName) {//SPAN !== B
2759-
// parent.insertBefore(new DNode(virtual), real)
2760-
// parent.removeChild(real)
2761-
// } else if (real.nodeName === "INPUT" && real.type !== virtual.type) {
2762-
// parent.insertBefore(new DNode(virtual), real)//input[type=text] !== input[type=password]
2763-
// parent.removeChild(real)
2764-
// } else if (real.vid !== virtual.vid) {
2765-
// parent.insertBefore(new DNode(virtual), real)
2766-
// parent.removeChild(real)
2767-
// }
2768-
// break
2769-
// default:
2770-
// if (real.nodeValue !== virtual.nodeValue) {
2771-
// real.nodeValue = virtual.nodeValue
2772-
// }
2773-
// }
2774-
// }
2775-
// }
2776-
// }
2777-
// if(collect){
2778-
// while (real && (real.nodeType !== 8 || real.nodeValue !== token)) {
2779-
// parent.removeChild(real)
2780-
// real = rnodes[i]
2781-
// }
2782-
// }
2783-
27842728
},
27852729
css: function (vnode, elem) {
27862730
for (var i in vnode.style) {

‎avalon.mobile.js

Lines changed: 14 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1595,9 +1595,9 @@ function rejectDisposeQueue(data) {
15951595
}
15961596

15971597
function disposeData(data) {
1598-
console.log("dispose")
1599-
console.log(data.type)
1600-
console.log(data.element)
1598+
// console.log("dispose")
1599+
// console.log(data.type)
1600+
// console.log(data.element)
16011601
data.element = null
16021602
data.rollback && data.rollback()
16031603
for (var key in data) {
@@ -2225,7 +2225,7 @@ var updateDTree = {
22252225
delete vnode.ifData
22262226
},
22272227
text: function (vnode, parent) {
2228-
console.log("text")
2228+
22292229
var rnodes = parent.childNodes
22302230
var vnodes = vnode.childNodes
22312231
traverseNodeBetweenSignature(vnodes, "v-text", {
@@ -2252,7 +2252,6 @@ var updateDTree = {
22522252
parent.removeChild(real)
22532253
real = rnodes[i]
22542254
}
2255-
22562255
},
22572256
step: function (virtual, i) {
22582257
var real = rnodes[i]
@@ -2282,14 +2281,14 @@ var updateDTree = {
22822281
})
22832282
},
22842283
repeat: function (vnode, parent) {
2285-
console.log("repeat")
2284+
avalon.log("repeat")
22862285
var rnodes = parent.childNodes
22872286
var vnodes = vnode.childNodes
22882287

22892288
var collect = false, token
2290-
var keys = {}, repeatRange = [], index = 0
2289+
var keys = {}, newRepeatNodes = [], oldRepeatNodes = [], index = 0
22912290
//收集从<!--v-repeat1213--> 到<!--v-repeat1213:end-->之间的节点,包括第一个<!--v-repeat1213-->
2292-
//将它们放进repeatRange,并在这过程中构建keys对象
2291+
//将它们放进newRepeatNodes,并在这过程中构建keys对象
22932292
for (var i = 0, virtual; virtual = vnodes[i]; i++) {
22942293
if (!collect && virtual.nodeType === 8 && /^v-(repeat|with|each)/.test(virtual.nodeValue)) {
22952294
token = virtual.nodeValue + ":end"
@@ -2307,12 +2306,11 @@ var updateDTree = {
23072306
keys[ virtual.nodeValue] = [index]
23082307
}
23092308
}
2310-
repeatRange[index] = virtual
2309+
newRepeatNodes[index] = virtual
23112310
index++
23122311
}
23132312
}
2314-
var older = []
2315-
collect = false
2313+
//对真实DOM根据keys给出的顺序进行重排，并删掉没用的旧节点，与生成缺少的新节点
23162314
for(var i = 0, node; node = rnodes[i]; i++){
23172315
if ( node.nodeType === 8 && /^v-(repeat|with|each)/.test(node.nodeValue)) {
23182316
token = node.nodeValue + ":end"
@@ -2326,80 +2324,26 @@ var updateDTree = {
23262324
//收集符合要求的真实DOM
23272325
parent.removeChild(node)
23282326
if (node.nodeType === 1) {
2329-
older[keys[node.vid]] = node
2327+
oldRepeatNodes[keys[node.vid]] = node
23302328
} else {
23312329
if (keys[node.nodeValue]) {
2332-
older[ keys[node.nodeValue].shift()] = node
2330+
oldRepeatNodes[ keys[node.nodeValue].shift()] = node
23332331
}
23342332
}
23352333
}
23362334
var fragment = DOC.createDocumentFragment()
2337-
for( i = 0; node = repeatRange[i];i ++){
2338-
if(older[i]){
2339-
fragment.appendChild(older[i])
2335+
for( i = 0; node = newRepeatNodes[i];i ++){
2336+
if(oldRepeatNodes[i]){
2337+
fragment.appendChild(oldRepeatNodes[i])
23402338
}else{
23412339
fragment.appendChild(new DNode(node))
23422340
}
23432341
}
23442342
parent.insertBefore(fragment,end)
23452343
break
23462344
}
2347-
23482345
}
23492346

2350-
2351-
2352-
// callbacks = callbacks || {}
2353-
// for (var i = 0, virtual; virtual = vnodes[i]; i++) {
2354-
// if (!collect && virtual.nodeType === 8 && virtual.nodeValue.indexOf("v-repeat") === 0) {
2355-
//
2356-
// token = virtual.nodeValue + ":end"
2357-
// collect = true
2358-
// continue
2359-
// } else if (collect && virtual.nodeType === 8 && virtual.nodeValue === token) {
2360-
// // comments.push(el)
2361-
// collect = false
2362-
// while (real && (real.nodeType !== 8 || real.nodeValue !== token)) {
2363-
// parent.removeChild(real)
2364-
// real = rnodes[i]
2365-
// }
2366-
// console.log("end")
2367-
// // callbacks.end && callbacks.end(el, i)
2368-
// continue
2369-
// }
2370-
// if (collect) {
2371-
// var real = rnodes[i]
2372-
// if (virtual.nodeType !== real.nodeType) {
2373-
// parent.insertBefore(new DNode(virtual), real)
2374-
// } else {
2375-
// switch (virtual.nodeType) {
2376-
// case 1:
2377-
// if (real.nodeName !== virtual.nodeName) {//SPAN !== B
2378-
// parent.insertBefore(new DNode(virtual), real)
2379-
// parent.removeChild(real)
2380-
// } else if (real.nodeName === "INPUT" && real.type !== virtual.type) {
2381-
// parent.insertBefore(new DNode(virtual), real)//input[type=text] !== input[type=password]
2382-
// parent.removeChild(real)
2383-
// } else if (real.vid !== virtual.vid) {
2384-
// parent.insertBefore(new DNode(virtual), real)
2385-
// parent.removeChild(real)
2386-
// }
2387-
// break
2388-
// default:
2389-
// if (real.nodeValue !== virtual.nodeValue) {
2390-
// real.nodeValue = virtual.nodeValue
2391-
// }
2392-
// }
2393-
// }
2394-
// }
2395-
// }
2396-
// if(collect){
2397-
// while (real && (real.nodeType !== 8 || real.nodeValue !== token)) {
2398-
// parent.removeChild(real)
2399-
// real = rnodes[i]
2400-
// }
2401-
// }
2402-
24032347
},
24042348
css: function (vnode, elem) {
24052349
for (var i in vnode.style) {

‎avalon.mobile.old.js

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2633,7 +2633,6 @@ var updateDTree = {
26332633
parent.removeChild(real)
26342634
real = rnodes[i]
26352635
}
2636-
26372636
},
26382637
step: function (virtual, i) {
26392638
var real = rnodes[i]
@@ -2668,9 +2667,9 @@ var updateDTree = {
26682667
var vnodes = vnode.childNodes
26692668

26702669
var collect = false, token
2671-
var keys = {}, repeatRange = [], index = 0
2670+
var keys = {}, newRepeatNodes = [], oldRepeatNodes = [], index = 0
26722671
//收集从<!--v-repeat1213--> 到<!--v-repeat1213:end-->之间的节点,包括第一个<!--v-repeat1213-->
2673-
//将它们放进repeatRange,并在这过程中构建keys对象
2672+
//将它们放进newRepeatNodes,并在这过程中构建keys对象
26742673
for (var i = 0, virtual; virtual = vnodes[i]; i++) {
26752674
if (!collect && virtual.nodeType === 8 && /^v-(repeat|with|each)/.test(virtual.nodeValue)) {
26762675
token = virtual.nodeValue + ":end"
@@ -2688,12 +2687,11 @@ var updateDTree = {
26882687
keys[ virtual.nodeValue] = [index]
26892688
}
26902689
}
2691-
repeatRange[index] = virtual
2690+
newRepeatNodes[index] = virtual
26922691
index++
26932692
}
26942693
}
2695-
var older = []
2696-
collect = false
2694+
//对真实DOM根据keys给出的顺序进行重排，并删掉没用的旧节点，与生成缺少的新节点
26972695
for(var i = 0, node; node = rnodes[i]; i++){
26982696
if ( node.nodeType === 8 && /^v-(repeat|with|each)/.test(node.nodeValue)) {
26992697
token = node.nodeValue + ":end"
@@ -2707,25 +2705,24 @@ var updateDTree = {
27072705
//收集符合要求的真实DOM
27082706
parent.removeChild(node)
27092707
if (node.nodeType === 1) {
2710-
older[keys[node.vid]] = node
2708+
oldRepeatNodes[keys[node.vid]] = node
27112709
} else {
27122710
if (keys[node.nodeValue]) {
2713-
older[ keys[node.nodeValue].shift()] = node
2711+
oldRepeatNodes[ keys[node.nodeValue].shift()] = node
27142712
}
27152713
}
27162714
}
27172715
var fragment = DOC.createDocumentFragment()
2718-
for( i = 0; node = repeatRange[i];i ++){
2719-
if(older[i]){
2720-
fragment.appendChild(older[i])
2716+
for( i = 0; node = newRepeatNodes[i];i ++){
2717+
if(oldRepeatNodes[i]){
2718+
fragment.appendChild(oldRepeatNodes[i])
27212719
}else{
27222720
fragment.appendChild(new DNode(node))
27232721
}
27242722
}
27252723
parent.insertBefore(fragment,end)
27262724
break
27272725
}
2728-
27292726
}
27302727

27312728

0 commit comments

Comments
 (0)