@logicflow/vue-node-registry 1.0.5 → 1.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +3 -3
- package/CHANGELOG.md +16 -0
- package/es/teleport.js +21 -2
- package/es/teleport.js.map +1 -1
- package/es/view.js +7 -3
- package/es/view.js.map +1 -1
- package/lib/teleport.js +21 -2
- package/lib/teleport.js.map +1 -1
- package/lib/view.js +6 -2
- package/lib/view.js.map +1 -1
- package/package.json +3 -3
- package/src/teleport.ts +25 -4
- package/src/view.ts +5 -2
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
|
|
2
|
-
> @logicflow/vue-node-registry@1.0.
|
|
2
|
+
> @logicflow/vue-node-registry@1.0.7 prebuild /Users/r0ger1tlearn/WorkSpace/Github/DiDi/logicflow/packages/vue-node-registry
|
|
3
3
|
> rss
|
|
4
4
|
|
|
5
5
|
> [prebuild] run-s -s clean:build
|
|
6
6
|
> [clean:build] rimraf dist es lib
|
|
7
7
|
|
|
8
|
-
> @logicflow/vue-node-registry@1.0.
|
|
8
|
+
> @logicflow/vue-node-registry@1.0.7 build /Users/r0ger1tlearn/WorkSpace/Github/DiDi/logicflow/packages/vue-node-registry
|
|
9
9
|
> rss
|
|
10
10
|
|
|
11
11
|
> [build] run-p -s build:dev build:umd
|
|
@@ -31,4 +31,4 @@
|
|
|
31
31
|
| |
|
|
32
32
|
+----------------------------------------------+
|
|
33
33
|
[1m[33m(!) [plugin typescript] @rollup/plugin-typescript: Rollup requires that TypeScript produces ES Modules. Unfortunately your configuration specifies a "module" other than "esnext". Unless you know what you're doing, please change "module" to "esnext" in the target tsconfig.json file or plugin options.[39m[22m
|
|
34
|
-
[32mcreated [1mdist/index.min.js[22m in [
|
|
34
|
+
[32mcreated [1mdist/index.min.js[22m in [1m3.7s[22m[39m
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @logicflow/vue-node-registry
|
|
2
2
|
|
|
3
|
+
## 1.0.7
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- fix(vue-node-registry): 修复Teleport+KeepAlive场景下DOM重复渲染的问题 close #1768 #1862
|
|
8
|
+
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
- @logicflow/core@2.0.6
|
|
11
|
+
|
|
12
|
+
## 1.0.6
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- Updated dependencies
|
|
17
|
+
- @logicflow/core@2.0.5
|
|
18
|
+
|
|
3
19
|
## 1.0.5
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
package/es/teleport.js
CHANGED
|
@@ -30,9 +30,28 @@ export function getTeleport() {
|
|
|
30
30
|
}
|
|
31
31
|
active = true;
|
|
32
32
|
return defineComponent({
|
|
33
|
-
|
|
33
|
+
props: {
|
|
34
|
+
flowId: {
|
|
35
|
+
type: String,
|
|
36
|
+
required: true,
|
|
37
|
+
},
|
|
38
|
+
},
|
|
39
|
+
setup: function (props) {
|
|
34
40
|
return function () {
|
|
35
|
-
|
|
41
|
+
var children = [];
|
|
42
|
+
Object.keys(items).forEach(function (id) {
|
|
43
|
+
// https://github.com/didi/LogicFlow/issues/1768
|
|
44
|
+
// 多个不同的VueNodeView都会connect注册到items中，因此items存储了可能有多个flowId流程图的数据
|
|
45
|
+
// 当使用多个LogicFlow时，会创建多个flowId + 同时使用KeepAlive
|
|
46
|
+
// 每一次items改变，会触发不同flowId持有的setup()执行，由于每次setup()执行就是遍历items，因此存在多次重复渲染元素的问题
|
|
47
|
+
// 即items[0]会在Page1的setup()执行，items[0]也会在Page2的setup()执行，从而生成两个items[0]
|
|
48
|
+
// 比对当前界面显示的flowId，只更新items[当前页面flowId:nodeId]的数据
|
|
49
|
+
// 比如items[0]属于Page1的数据，那么Page2无论active=true/false，都无法执行items[0]
|
|
50
|
+
if (id.startsWith(props.flowId)) {
|
|
51
|
+
children.push(items[id]);
|
|
52
|
+
}
|
|
53
|
+
});
|
|
54
|
+
return h(Fragment, {}, children.map(function (item) { return h(item); }));
|
|
36
55
|
};
|
|
37
56
|
},
|
|
38
57
|
});
|
package/es/teleport.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"teleport.js","sourceRoot":"","sources":["../src/teleport.ts"],"names":[],"mappings":"AACA,OAAO,EACL,eAAe,EACf,CAAC,EACD,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,MAAM,UAAU,CAAA;AAEjB,IAAI,MAAM,GAAG,KAAK,CAAA;AAClB,IAAM,KAAK,GAAG,QAAQ,CAAyB,EAAE,CAAC,CAAA;AAElD,MAAM,UAAU,OAAO,CACrB,EAAU,EACV,SAAc,EACd,SAAyB,EACzB,IAAmB,EACnB,KAAiB;IAEjB,IAAI,MAAM,EAAE,CAAC;QACX,KAAK,CAAC,EAAE,CAAC,GAAG,OAAO,CACjB,eAAe,CAAC;YACd,MAAM,EAAE;gBACN,OAAA,CAAC,CAAC,QAAQ,EAAE,EAAE,EAAE,EAAE,SAAS,EAAS,EAAE;oBACpC,CAAC,CAAC,SAAS,EAAE,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC;iBAC9B,CAAC;YAFF,CAEE;YACJ,OAAO,EAAE,cAAM,OAAA,CAAC;gBACd,OAAO,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;gBACnB,QAAQ,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;aACtB,CAAC,EAHa,CAGb;SACH,CAAC,CACH,CAAA;IACH,CAAC;AACH,CAAC;AAED,MAAM,UAAU,UAAU,CAAC,EAAU;IACnC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,KAAK,CAAC,EAAE,CAAC,CAAA;IAClB,CAAC;AACH,CAAC;AAED,MAAM,UAAU,QAAQ;IACtB,OAAO,MAAM,CAAA;AACf,CAAC;AAED,MAAM,UAAU,WAAW;IACzB,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAA;IACvD,CAAC;IACD,MAAM,GAAG,IAAI,CAAA;IAEb,OAAO,eAAe,CAAC;QACrB,KAAK;
|
|
1
|
+
{"version":3,"file":"teleport.js","sourceRoot":"","sources":["../src/teleport.ts"],"names":[],"mappings":"AACA,OAAO,EACL,eAAe,EACf,CAAC,EACD,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,MAAM,UAAU,CAAA;AAEjB,IAAI,MAAM,GAAG,KAAK,CAAA;AAClB,IAAM,KAAK,GAAG,QAAQ,CAAyB,EAAE,CAAC,CAAA;AAElD,MAAM,UAAU,OAAO,CACrB,EAAU,EACV,SAAc,EACd,SAAyB,EACzB,IAAmB,EACnB,KAAiB;IAEjB,IAAI,MAAM,EAAE,CAAC;QACX,KAAK,CAAC,EAAE,CAAC,GAAG,OAAO,CACjB,eAAe,CAAC;YACd,MAAM,EAAE;gBACN,OAAA,CAAC,CAAC,QAAQ,EAAE,EAAE,EAAE,EAAE,SAAS,EAAS,EAAE;oBACpC,CAAC,CAAC,SAAS,EAAE,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC;iBAC9B,CAAC;YAFF,CAEE;YACJ,OAAO,EAAE,cAAM,OAAA,CAAC;gBACd,OAAO,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;gBACnB,QAAQ,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;aACtB,CAAC,EAHa,CAGb;SACH,CAAC,CACH,CAAA;IACH,CAAC;AACH,CAAC;AAED,MAAM,UAAU,UAAU,CAAC,EAAU;IACnC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,KAAK,CAAC,EAAE,CAAC,CAAA;IAClB,CAAC;AACH,CAAC;AAED,MAAM,UAAU,QAAQ;IACtB,OAAO,MAAM,CAAA;AACf,CAAC;AAED,MAAM,UAAU,WAAW;IACzB,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAA;IACvD,CAAC;IACD,MAAM,GAAG,IAAI,CAAA;IAEb,OAAO,eAAe,CAAC;QACrB,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,IAAI,EAAE,MAAM;gBACZ,QAAQ,EAAE,IAAI;aACf;SACF;QACD,KAAK,YAAC,KAAK;YACT,OAAO;gBACL,IAAM,QAAQ,GAA0B,EAAE,CAAA;gBAC1C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,UAAC,EAAE;oBAC5B,gDAAgD;oBAChD,iEAAiE;oBACjE,8CAA8C;oBAC9C,4EAA4E;oBAC5E,uEAAuE;oBAEvE,iDAAiD;oBACjD,gEAAgE;oBAChE,IAAI,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;wBAChC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;oBAC1B,CAAC;gBACH,CAAC,CAAC,CAAA;gBACF,OAAO,CAAC,CACN,QAAQ,EACR,EAAE,EACF,QAAQ,CAAC,GAAG,CAAC,UAAC,IAAI,IAAK,OAAA,CAAC,CAAC,IAAI,CAAC,EAAP,CAAO,CAAC,CAChC,CAAA;YACH,CAAC,CAAA;QACH,CAAC;KACF,CAAC,CAAA;AACJ,CAAC"}
|
package/es/view.js
CHANGED
|
@@ -16,7 +16,7 @@ var __extends = (this && this.__extends) || (function () {
|
|
|
16
16
|
import { isVue2, isVue3, createApp, h, Vue2 } from 'vue-demi';
|
|
17
17
|
import { HtmlNode } from '@logicflow/core';
|
|
18
18
|
import { vueNodesMap } from './registry';
|
|
19
|
-
import { isActive, connect } from './teleport';
|
|
19
|
+
import { isActive, connect, disconnect } from './teleport';
|
|
20
20
|
var VueNodeView = /** @class */ (function (_super) {
|
|
21
21
|
__extends(VueNodeView, _super);
|
|
22
22
|
function VueNodeView() {
|
|
@@ -39,9 +39,10 @@ var VueNodeView = /** @class */ (function (_super) {
|
|
|
39
39
|
rootEl.appendChild(el);
|
|
40
40
|
this.renderVueComponent();
|
|
41
41
|
};
|
|
42
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
42
43
|
VueNodeView.prototype.confirmUpdate = function (_rootEl) {
|
|
43
44
|
// TODO: 如有需要，可以先通过继承的方式，自定义该节点的更新逻辑；我们后续会根据实际需求，丰富该功能
|
|
44
|
-
console.log('_rootEl', _rootEl)
|
|
45
|
+
// console.log('_rootEl', _rootEl)
|
|
45
46
|
};
|
|
46
47
|
VueNodeView.prototype.renderVueComponent = function () {
|
|
47
48
|
var _a;
|
|
@@ -98,7 +99,7 @@ var VueNodeView = /** @class */ (function (_super) {
|
|
|
98
99
|
var root = this.getComponentContainer();
|
|
99
100
|
if (this.vm) {
|
|
100
101
|
isVue2 && this.vm.$destroy();
|
|
101
|
-
isVue3 && this.vm
|
|
102
|
+
isVue3 && this.vm.unmount();
|
|
102
103
|
this.vm = null;
|
|
103
104
|
}
|
|
104
105
|
if (root) {
|
|
@@ -107,6 +108,9 @@ var VueNodeView = /** @class */ (function (_super) {
|
|
|
107
108
|
return root;
|
|
108
109
|
};
|
|
109
110
|
VueNodeView.prototype.unmount = function () {
|
|
111
|
+
if (isActive()) {
|
|
112
|
+
disconnect(this.targetId());
|
|
113
|
+
}
|
|
110
114
|
this.unmountVueComponent();
|
|
111
115
|
};
|
|
112
116
|
return VueNodeView;
|
package/es/view.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"view.js","sourceRoot":"","sources":["../src/view.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAC7D,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;
|
|
1
|
+
{"version":3,"file":"view.js","sourceRoot":"","sources":["../src/view.ts"],"names":[],"mappings":"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"}
|
package/lib/teleport.js
CHANGED
|
@@ -36,9 +36,28 @@ function getTeleport() {
|
|
|
36
36
|
}
|
|
37
37
|
active = true;
|
|
38
38
|
return (0, vue_demi_1.defineComponent)({
|
|
39
|
-
|
|
39
|
+
props: {
|
|
40
|
+
flowId: {
|
|
41
|
+
type: String,
|
|
42
|
+
required: true,
|
|
43
|
+
},
|
|
44
|
+
},
|
|
45
|
+
setup: function (props) {
|
|
40
46
|
return function () {
|
|
41
|
-
|
|
47
|
+
var children = [];
|
|
48
|
+
Object.keys(items).forEach(function (id) {
|
|
49
|
+
// https://github.com/didi/LogicFlow/issues/1768
|
|
50
|
+
// 多个不同的VueNodeView都会connect注册到items中，因此items存储了可能有多个flowId流程图的数据
|
|
51
|
+
// 当使用多个LogicFlow时，会创建多个flowId + 同时使用KeepAlive
|
|
52
|
+
// 每一次items改变，会触发不同flowId持有的setup()执行，由于每次setup()执行就是遍历items，因此存在多次重复渲染元素的问题
|
|
53
|
+
// 即items[0]会在Page1的setup()执行，items[0]也会在Page2的setup()执行，从而生成两个items[0]
|
|
54
|
+
// 比对当前界面显示的flowId，只更新items[当前页面flowId:nodeId]的数据
|
|
55
|
+
// 比如items[0]属于Page1的数据，那么Page2无论active=true/false，都无法执行items[0]
|
|
56
|
+
if (id.startsWith(props.flowId)) {
|
|
57
|
+
children.push(items[id]);
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
return (0, vue_demi_1.h)(vue_demi_1.Fragment, {}, children.map(function (item) { return (0, vue_demi_1.h)(item); }));
|
|
42
61
|
};
|
|
43
62
|
},
|
|
44
63
|
});
|
package/lib/teleport.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"teleport.js","sourceRoot":"","sources":["../src/teleport.ts"],"names":[],"mappings":";;;AACA,qCAQiB;AAEjB,IAAI,MAAM,GAAG,KAAK,CAAA;AAClB,IAAM,KAAK,GAAG,IAAA,mBAAQ,EAAyB,EAAE,CAAC,CAAA;AAElD,SAAgB,OAAO,CACrB,EAAU,EACV,SAAc,EACd,SAAyB,EACzB,IAAmB,EACnB,KAAiB;IAEjB,IAAI,MAAM,EAAE,CAAC;QACX,KAAK,CAAC,EAAE,CAAC,GAAG,IAAA,kBAAO,EACjB,IAAA,0BAAe,EAAC;YACd,MAAM,EAAE;gBACN,OAAA,IAAA,YAAC,EAAC,mBAAQ,EAAE,EAAE,EAAE,EAAE,SAAS,EAAS,EAAE;oBACpC,IAAA,YAAC,EAAC,SAAS,EAAE,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC;iBAC9B,CAAC;YAFF,CAEE;YACJ,OAAO,EAAE,cAAM,OAAA,CAAC;gBACd,OAAO,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;gBACnB,QAAQ,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;aACtB,CAAC,EAHa,CAGb;SACH,CAAC,CACH,CAAA;IACH,CAAC;AACH,CAAC;AArBD,0BAqBC;AAED,SAAgB,UAAU,CAAC,EAAU;IACnC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,KAAK,CAAC,EAAE,CAAC,CAAA;IAClB,CAAC;AACH,CAAC;AAJD,gCAIC;AAED,SAAgB,QAAQ;IACtB,OAAO,MAAM,CAAA;AACf,CAAC;AAFD,4BAEC;AAED,SAAgB,WAAW;IACzB,IAAI,CAAC,iBAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAA;IACvD,CAAC;IACD,MAAM,GAAG,IAAI,CAAA;IAEb,OAAO,IAAA,0BAAe,EAAC;QACrB,KAAK;
|
|
1
|
+
{"version":3,"file":"teleport.js","sourceRoot":"","sources":["../src/teleport.ts"],"names":[],"mappings":";;;AACA,qCAQiB;AAEjB,IAAI,MAAM,GAAG,KAAK,CAAA;AAClB,IAAM,KAAK,GAAG,IAAA,mBAAQ,EAAyB,EAAE,CAAC,CAAA;AAElD,SAAgB,OAAO,CACrB,EAAU,EACV,SAAc,EACd,SAAyB,EACzB,IAAmB,EACnB,KAAiB;IAEjB,IAAI,MAAM,EAAE,CAAC;QACX,KAAK,CAAC,EAAE,CAAC,GAAG,IAAA,kBAAO,EACjB,IAAA,0BAAe,EAAC;YACd,MAAM,EAAE;gBACN,OAAA,IAAA,YAAC,EAAC,mBAAQ,EAAE,EAAE,EAAE,EAAE,SAAS,EAAS,EAAE;oBACpC,IAAA,YAAC,EAAC,SAAS,EAAE,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,CAAC;iBAC9B,CAAC;YAFF,CAEE;YACJ,OAAO,EAAE,cAAM,OAAA,CAAC;gBACd,OAAO,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;gBACnB,QAAQ,EAAE,cAAM,OAAA,KAAK,EAAL,CAAK;aACtB,CAAC,EAHa,CAGb;SACH,CAAC,CACH,CAAA;IACH,CAAC;AACH,CAAC;AArBD,0BAqBC;AAED,SAAgB,UAAU,CAAC,EAAU;IACnC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,KAAK,CAAC,EAAE,CAAC,CAAA;IAClB,CAAC;AACH,CAAC;AAJD,gCAIC;AAED,SAAgB,QAAQ;IACtB,OAAO,MAAM,CAAA;AACf,CAAC;AAFD,4BAEC;AAED,SAAgB,WAAW;IACzB,IAAI,CAAC,iBAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC,CAAA;IACvD,CAAC;IACD,MAAM,GAAG,IAAI,CAAA;IAEb,OAAO,IAAA,0BAAe,EAAC;QACrB,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,IAAI,EAAE,MAAM;gBACZ,QAAQ,EAAE,IAAI;aACf;SACF;QACD,KAAK,YAAC,KAAK;YACT,OAAO;gBACL,IAAM,QAAQ,GAA0B,EAAE,CAAA;gBAC1C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,UAAC,EAAE;oBAC5B,gDAAgD;oBAChD,iEAAiE;oBACjE,8CAA8C;oBAC9C,4EAA4E;oBAC5E,uEAAuE;oBAEvE,iDAAiD;oBACjD,gEAAgE;oBAChE,IAAI,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;wBAChC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;oBAC1B,CAAC;gBACH,CAAC,CAAC,CAAA;gBACF,OAAO,IAAA,YAAC,EACN,mBAAQ,EACR,EAAE,EACF,QAAQ,CAAC,GAAG,CAAC,UAAC,IAAI,IAAK,OAAA,IAAA,YAAC,EAAC,IAAI,CAAC,EAAP,CAAO,CAAC,CAChC,CAAA;YACH,CAAC,CAAA;QACH,CAAC;KACF,CAAC,CAAA;AACJ,CAAC;AArCD,kCAqCC"}
|
package/lib/view.js
CHANGED
|
@@ -42,9 +42,10 @@ var VueNodeView = /** @class */ (function (_super) {
|
|
|
42
42
|
rootEl.appendChild(el);
|
|
43
43
|
this.renderVueComponent();
|
|
44
44
|
};
|
|
45
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
45
46
|
VueNodeView.prototype.confirmUpdate = function (_rootEl) {
|
|
46
47
|
// TODO: 如有需要，可以先通过继承的方式，自定义该节点的更新逻辑；我们后续会根据实际需求，丰富该功能
|
|
47
|
-
console.log('_rootEl', _rootEl)
|
|
48
|
+
// console.log('_rootEl', _rootEl)
|
|
48
49
|
};
|
|
49
50
|
VueNodeView.prototype.renderVueComponent = function () {
|
|
50
51
|
var _a;
|
|
@@ -101,7 +102,7 @@ var VueNodeView = /** @class */ (function (_super) {
|
|
|
101
102
|
var root = this.getComponentContainer();
|
|
102
103
|
if (this.vm) {
|
|
103
104
|
vue_demi_1.isVue2 && this.vm.$destroy();
|
|
104
|
-
vue_demi_1.isVue3 && this.vm
|
|
105
|
+
vue_demi_1.isVue3 && this.vm.unmount();
|
|
105
106
|
this.vm = null;
|
|
106
107
|
}
|
|
107
108
|
if (root) {
|
|
@@ -110,6 +111,9 @@ var VueNodeView = /** @class */ (function (_super) {
|
|
|
110
111
|
return root;
|
|
111
112
|
};
|
|
112
113
|
VueNodeView.prototype.unmount = function () {
|
|
114
|
+
if ((0, teleport_1.isActive)()) {
|
|
115
|
+
(0, teleport_1.disconnect)(this.targetId());
|
|
116
|
+
}
|
|
113
117
|
this.unmountVueComponent();
|
|
114
118
|
};
|
|
115
119
|
return VueNodeView;
|
package/lib/view.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"view.js","sourceRoot":"","sources":["../src/view.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,qCAA6D;AAC7D,wCAA0C;AAC1C,uCAAwC;AACxC,
|
|
1
|
+
{"version":3,"file":"view.js","sourceRoot":"","sources":["../src/view.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@logicflow/vue-node-registry",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.7",
|
|
4
4
|
"description": "LogicFlow Vue Component Node Registry",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"peerDependencies": {
|
|
21
21
|
"@vue/composition-api": "^1.0.0-rc.10",
|
|
22
22
|
"vue": "^2.0.0 || >=3.0.0",
|
|
23
|
-
"@logicflow/core": "2.0.
|
|
23
|
+
"@logicflow/core": "2.0.6"
|
|
24
24
|
},
|
|
25
25
|
"peerDependenciesMeta": {
|
|
26
26
|
"@vue/composition-api": {
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"vue": "^3.0.0",
|
|
32
|
-
"@logicflow/core": "2.0.
|
|
32
|
+
"@logicflow/core": "2.0.6"
|
|
33
33
|
},
|
|
34
34
|
"author": {
|
|
35
35
|
"name": "boyongjiong",
|
package/src/teleport.ts
CHANGED
|
@@ -52,13 +52,34 @@ export function getTeleport(): any {
|
|
|
52
52
|
active = true
|
|
53
53
|
|
|
54
54
|
return defineComponent({
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
55
|
+
props: {
|
|
56
|
+
flowId: {
|
|
57
|
+
type: String,
|
|
58
|
+
required: true,
|
|
59
|
+
},
|
|
60
|
+
},
|
|
61
|
+
setup(props) {
|
|
62
|
+
return () => {
|
|
63
|
+
const children: Record<string, any>[] = []
|
|
64
|
+
Object.keys(items).forEach((id) => {
|
|
65
|
+
// https://github.com/didi/LogicFlow/issues/1768
|
|
66
|
+
// 多个不同的VueNodeView都会connect注册到items中，因此items存储了可能有多个flowId流程图的数据
|
|
67
|
+
// 当使用多个LogicFlow时，会创建多个flowId + 同时使用KeepAlive
|
|
68
|
+
// 每一次items改变，会触发不同flowId持有的setup()执行，由于每次setup()执行就是遍历items，因此存在多次重复渲染元素的问题
|
|
69
|
+
// 即items[0]会在Page1的setup()执行，items[0]也会在Page2的setup()执行，从而生成两个items[0]
|
|
70
|
+
|
|
71
|
+
// 比对当前界面显示的flowId，只更新items[当前页面flowId:nodeId]的数据
|
|
72
|
+
// 比如items[0]属于Page1的数据，那么Page2无论active=true/false，都无法执行items[0]
|
|
73
|
+
if (id.startsWith(props.flowId)) {
|
|
74
|
+
children.push(items[id])
|
|
75
|
+
}
|
|
76
|
+
})
|
|
77
|
+
return h(
|
|
58
78
|
Fragment,
|
|
59
79
|
{},
|
|
60
|
-
|
|
80
|
+
children.map((item) => h(item)),
|
|
61
81
|
)
|
|
82
|
+
}
|
|
62
83
|
},
|
|
63
84
|
})
|
|
64
85
|
}
|
package/src/view.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { isVue2, isVue3, createApp, h, Vue2 } from 'vue-demi'
|
|
2
2
|
import { HtmlNode } from '@logicflow/core'
|
|
3
3
|
import { vueNodesMap } from './registry'
|
|
4
|
-
import { isActive, connect } from './teleport'
|
|
4
|
+
import { isActive, connect, disconnect } from './teleport'
|
|
5
5
|
|
|
6
6
|
export class VueNodeView extends HtmlNode {
|
|
7
7
|
root?: any
|
|
@@ -89,7 +89,7 @@ export class VueNodeView extends HtmlNode {
|
|
|
89
89
|
const root = this.getComponentContainer()
|
|
90
90
|
if (this.vm) {
|
|
91
91
|
isVue2 && this.vm.$destroy()
|
|
92
|
-
isVue3 && this.vm
|
|
92
|
+
isVue3 && this.vm.unmount()
|
|
93
93
|
this.vm = null
|
|
94
94
|
}
|
|
95
95
|
if (root) {
|
|
@@ -99,6 +99,9 @@ export class VueNodeView extends HtmlNode {
|
|
|
99
99
|
}
|
|
100
100
|
|
|
101
101
|
unmount() {
|
|
102
|
+
if (isActive()) {
|
|
103
|
+
disconnect(this.targetId())
|
|
104
|
+
}
|
|
102
105
|
this.unmountVueComponent()
|
|
103
106
|
}
|
|
104
107
|
}
|