8000 fix: unwarpping lose reactivity · Kingwl/vue-function-api@109b877 · GitHub
[go: up one dir, main page]

Skip to content

Commit 109b877

Browse files
committed
fix: unwarpping lose reactivity
1 parent 6594b83 commit 109b877

File tree

4 files changed

+60
-26
lines changed

4 files changed

+60
-26
lines changed

src/functions/state.ts

Lines changed: 1 addition & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,6 @@
11
import { Wrapper, ValueWrapper } from '../wrappers';
22
import { isArray, isPlainObject } from '../utils';
3-
import { observable, isWrapper } from '../helper';
4-
5-
function upWrapping(obj: any) {
6-
if (!obj) {
7-
return obj;
8-
}
9-
10-
const keys = Object.keys(obj);
11-
for (let index = 0; index < keys.length; index++) {
12-
const key = keys[index];
13-
const value = obj[key];
14-
if (isWrapper(value)) {
15-
obj[key] = value.value;
16-
} else if (isPlainObject(value) || isArray(value)) {
17-
obj[key] = upWrapping(value);
18-
}
19-
}
20-
21-
return obj;
22-
}
3+
import { observable, upWrapping } from '../helper';
234

245
export function state<T>(value: T): T {
256
return observable(isArray(value) || isPlainObject(value) ? upWrapping(value) : value);

src/helper.ts

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,37 @@
11
import { VueConstructor } from 'vue';
22
import { getCurrentVue, getCurrentVM } from './runtimeContext';
3-
import { assert } from './utils';
3+
import { assert, isPlainObject, isArray, proxy } from './utils';
44
import { AbstractWrapper } from './wrappers';
55

6+
export function upWrapping(obj: any) {
7+
if (!obj) {
8+
return obj;
9+
}
10+
11+
const result: Record<string, any> = {};
12+
const keys = Object.keys(obj);
13+
for (let index = 0; index < keys.length; index++) {
14+
const key = keys[index];
15+
const value = obj[key];
16+
if (isWrapper(value)) {
17+
proxy(
18+
result,
19+
key,
20+
() => value.value,
21+
(val: any) => {
22+
value.value = val;
23+
}
24+
);
25+
} else if (isPlainObject(value) || isArray(value)) {
26+
result[key] = upWrapping(value);
27+
} else {
28+
result[key] = value;
29+
}
30+
}
31+
32+
return result;
33+
}
34+
635
export function isWrapper<T>(obj: any): obj is AbstractWrapper<T> {
736
return obj instanceof AbstractWrapper;
837
}

src/setup.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ export function mixin(Vue: VueConstructor) {
3737
if (process.env.NODE_ENV !== 'production') {
3838
Vue.util.warn(`there is an error occuring in "setup"`, vm);
3939
}
40-
console.log(err);
40+
throw err;
4141
} finally {
4242
setCurrentVM(null);
4343
}

test/functions/state.spec.js

Lines changed: 28 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -57,12 +57,36 @@ describe('Hooks state', () => {
5757
}).then(done);
5858
});
5959

60-
it('should be unwrapping(nested property inside a reactive object)', () => {
60+
it.only('should be unwrapping(nested property inside a reactive object)', () => {
6161
new Vue({
6262
setup() {
63-
const a = value(1);
64-
const b = state({ a });
65-
expect(b.a).toBe(1);
63+
const count = value(0);
64+
const count1 = value(0);
65+
const obj = state({
66+
count,
67+
a: {
68+
b: count1,
69+
c: 0,
70+
},
71+
});
72+
73+
expect(obj.count).toBe(0);
74+
expect(obj.a.b).toBe(0);
75+
expect(obj.a.c).toBe(0);
76+
77+
obj.count++;
78+
expect(obj.count).toBe(1);
79+
expect(count.value).toBe(1);
80+
expect(count1.value).toBe(0);
81+
82+
count.value++;
83+
count1.value++;
84+
obj.a.b++;
85+
obj.a.c = 3;
86+
expect(obj.count).toBe(2);
87+
expect(count1.value).toBe(2);
88+
expect(obj.a.b).toBe(2);
89+
expect(obj.a.c).toBe(3);
6690
},
6791
});
6892
});

0 commit comments

Comments
 (0)
0