caoww
/
fineui
forked from fanruan/fineui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Pull request #2106: 无JIRA任务 解决index和key的冲突问题 

Merge in VISUAL/fineui from ~GUY/fineui:master to master

* commit 'a3414cfba9c817e19c840aba7ad0ca25b7636cbf':
  整理代码
  整理代码
  整理代码
es6
guy 3 years ago
parent
5a60649be0 a3414cfba9
commit
c1dfb66d59
4 changed files with 185 additions and 111 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 119
      examples/dev.html
  2. 142
      examples/插件设计.html
  3. 31
      src/core/wrapper/layout.js
  4. 2
      template/index.html

119
examples/dev.html
Unescape View File

@ -9,85 +9,6 @@
<body> <body>
<div id="wrapper"></div> <div id="wrapper"></div>
<script> <script>
BI.config("demo.parent", function (config){
console.log("123");
return config;
}, {
version: "1.0"
});
BI.module("my.module", {
// version不设置的话默认就用接口的version作为判断条件
version: "1.0",
components: {
"demo.parent": "1.0"
}
})
// 主线代码里加这个
BI.config("bi.provider.system", function (provider) {
provider.addDependencies({
"my.module": {
minVersion: "2.0",
maxVersion: "4.0"
}
})
})
</script>
<script>
var Model = BI.inherit(Fix.Model, {
state: function () {
return {
expand: false
};
},
childContext: ["text"],
computed: {
text: function () {
return this.model.expand ? "text-yes" : "text-not";
}
},
actions: {
toggle: function () {
this.model.expand = !this.model.expand;
}
}
});
BI.model("demo.model", Model);
var ChildModel = BI.inherit(Fix.Model, {
context: ["text"]
});
BI.model("demo.child_model", ChildModel);
var Child = BI.inherit(BI.Widget, {
setup: function () {
var store = BI.useStore(function () {
return BI.Models.getModel("demo.child_model");
});
return {
render: function () {
return {
type: "bi.vertical",
items: [{
type: "bi.button",
text: store.model.text,
handler: function () {
console.log("click");
}
}, {
type: "bi.label",
text: store.model.text
}]
};
}
};
}
});
BI.shortcut("demo.child", Child);
var Widget = BI.inherit(BI.Widget, { var Widget = BI.inherit(BI.Widget, {
props: { props: {
@ -99,27 +20,35 @@
} }
}, },
setup: function () { setup: function () {
var child; var layout;
var store = BI.useStore(function () {
return BI.Models.getModel("demo.model");
});
setInterval(function () {
store.toggle();
}, 1000);
// BI.watch("text", function () {
// child.reset();
// });
return function () { return function () {
return { return {
type: "bi.vertical", type: "bi.left",
vgap: store.model.expand ? 20 : 30,
items: [{ items: [{
type: "demo.child", type: "bi.button",
ref: function (_ref) { text: "点击",
child = _ref; handler: function () {
layout.populate([{
type: "bi.label",
key: "1",
text: 1
}, {
type: "bi.label",
key: "2",
text: 2
}])
} }
}, { }, {
type: "demo.child" type: "bi.left",
lgap: 10,
items: [{
type: "bi.label",
key: "123",
text: "start"
}],
ref: function (_ref) {
layout = _ref;
}
}] }]
}; };
}; };

142
examples/插件设计.html
Unescape View File

@ -0,0 +1,142 @@
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="../dist/2.0/fineui.css"/>
<!-- <script src="../dist/2.0/fineui.js"></script>-->
<script src="http://localhost:9001/fineui.js"></script>
</head>
<body>
<div id="wrapper"></div>
<script>
BI.config("demo.parent", function (config){
console.log("123");
return config;
}, {
version: "1.0"
});
BI.module("my.module", {
// version不设置的话默认就用接口的version作为判断条件
version: "1.0",
components: {
"demo.parent": "1.0"
}
})
// 主线代码里加这个
BI.config("bi.provider.system", function (provider) {
provider.addDependencies({
"my.module": {
minVersion: "2.0",
maxVersion: "4.0"
}
})
})
</script>
<script>
var Model = BI.inherit(Fix.Model, {
state: function () {
return {
expand: false
};
},
childContext: ["text"],
computed: {
text: function () {
return this.model.expand ? "text-yes" : "text-not";
}
},
actions: {
toggle: function () {
this.model.expand = !this.model.expand;
}
}
});
BI.model("demo.model", Model);
var ChildModel = BI.inherit(Fix.Model, {
context: ["text"]
});
BI.model("demo.child_model", ChildModel);
var Child = BI.inherit(BI.Widget, {
setup: function () {
var store = BI.useStore(function () {
return BI.Models.getModel("demo.child_model");
});
return {
render: function () {
return {
type: "bi.vertical",
items: [{
type: "bi.button",
text: store.model.text,
handler: function () {
console.log("click");
}
}, {
type: "bi.label",
text: store.model.text
}]
};
}
};
}
});
BI.shortcut("demo.child", Child);
var Widget = BI.inherit(BI.Widget, {
props: {
vdom: true
},
watch: {
text: function () {
this.reset();
}
},
setup: function () {
var child;
var store = BI.useStore(function () {
return BI.Models.getModel("demo.model");
});
setInterval(function () {
store.toggle();
}, 1000);
// BI.watch("text", function () {
// child.reset();
// });
return function () {
return {
type: "bi.vertical",
vgap: store.model.expand ? 20 : 30,
items: [{
type: "demo.child",
ref: function (_ref) {
child = _ref;
}
}, {
type: "demo.child"
}]
};
};
}
});
BI.shortcut("demo.parent", Widget);
BI.createWidget({
type: "bi.absolute",
items: [{
el: {
type: "demo.parent"
},
top: 100,
left: 100
}],
element: "#wrapper"
});
</script>
</body>
</html>

31
src/core/wrapper/layout.js
Unescape View File

@ -440,21 +440,21 @@ BI.Layout = BI.inherit(BI.Widget, {
newStartVnode = newCh[++newStartIdx]; newStartVnode = newCh[++newStartIdx];
} else { } else {
var sameOldVnode = findOldVnode(oldCh, newStartVnode, oldStartIdx, oldEndIdx); var sameOldVnode = findOldVnode(oldCh, newStartVnode, oldStartIdx, oldEndIdx);
if (BI.isNull(sameOldVnode)) { // 不存在就把新的放到左边 if (BI.isNull(sameOldVnode[0])) { // 不存在就把新的放到左边
delete self._children[self._getChildName(newStartIdx)];
var node = addNode(newStartVnode, newStartIdx); var node = addNode(newStartVnode, newStartIdx);
insertBefore(node, oldStartVnode); insertBefore(node, oldStartVnode);
newStartVnode = newCh[++newStartIdx]; } else { // 如果新节点在旧节点区间中存在就复用一下
} else { // 如果新节点在就旧节点区间中存在就复用一下 var sameOldIndex = sameOldVnode[1];
BI.each(oldCh, function (index, child) { updated = self.patchItem(sameOldVnode[0], newStartVnode, sameOldIndex, newStartIdx) || updated;
if (child && sameVnode(child, newStartVnode)) { children[sameOldVnode[0].key == null ? newStartIdx : sameOldVnode[0].key] = self._children[self._getChildName(newStartIdx)] = self._children[self._getChildName(sameOldIndex)];
updated = self.patchItem(sameOldVnode, newStartVnode, index, index) || updated; if (newStartIdx !== sameOldIndex) {
children[sameOldVnode.key == null ? index : sameOldVnode.key] = self._children[self._getChildName(index)]; delete self._children[self._getChildName(sameOldIndex)];
oldCh[index] = undefined;
insertBefore(sameOldVnode, oldStartVnode);
} }
}); oldCh[sameOldIndex] = undefined;
newStartVnode = newCh[++newStartIdx]; insertBefore(sameOldVnode[0], oldStartVnode);
} }
newStartVnode = newCh[++newStartIdx];
} }
} }
if (oldStartIdx > oldEndIdx) { if (oldStartIdx > oldEndIdx) {
@ -486,7 +486,7 @@ BI.Layout = BI.inherit(BI.Widget, {
function addNode (vnode, index) { function addNode (vnode, index) {
var opt = self._getOptions(vnode); var opt = self._getOptions(vnode);
var key = opt.key == null ? index : opt.key; var key = opt.key == null ? index : opt.key;
return children[key] = self._addElement(key, vnode); return children[key] = self._addElement(index, vnode);
} }
function addVnodes (before, vnodes, startIdx, endIdx) { function addVnodes (before, vnodes, startIdx, endIdx) {
@ -502,7 +502,7 @@ BI.Layout = BI.inherit(BI.Widget, {
if (BI.isNotNull(ch)) { if (BI.isNotNull(ch)) {
var node = self._getOptions(ch); var node = self._getOptions(ch);
var key = node.key == null ? startIdx : node.key; var key = node.key == null ? startIdx : node.key;
delete self._children[self._getChildName(key)]; delete self._children[self._getChildName(startIdx)];
children[key]._destroy(); children[key]._destroy();
} }
} }
@ -531,13 +531,14 @@ BI.Layout = BI.inherit(BI.Widget, {
} }
function findOldVnode (vnodes, vNode, beginIdx, endIdx) { function findOldVnode (vnodes, vNode, beginIdx, endIdx) {
var i, found; var i, found, findIndex;
for (i = beginIdx; i <= endIdx; ++i) { for (i = beginIdx; i <= endIdx; ++i) {
if (vnodes[i] && sameVnode(vnodes[i], vNode)) { if (vnodes[i] && sameVnode(vnodes[i], vNode)) {
found = vnodes[i]; found = vnodes[i];
findIndex = i;
} }
} }
return found; return [found, findIndex];
} }
return updated; return updated;

2
template/index.html
Unescape View File

@ -10,6 +10,8 @@
</head> </head>
<body> <body>
<div id="wrapper"></div> <div id="wrapper"></div>
</body> </body>
<script src="../dist/router.js"></script>
</html> </html>

Write Preview
Loading…
Cancel
Save