-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: watch支持配置单个字段监控多个数据,但没有类型提示 计算属性初始化改为beforeCreated
Release-As: 1.3.0
- Loading branch information
Showing
33 changed files
with
421 additions
and
561 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,72 @@ | ||
import { load, render, sleep } from "miniprogram-simulate"; | ||
import path from "path"; | ||
import { user } from "../../common"; | ||
|
||
describe("计算属性 --> 一般测试", () => { | ||
const id = load(path.resolve(__dirname, "normal")); // 此处必须传入绝对路径 | ||
const comp = render(id, { requiredUser: user }); // 渲染成自定义组件树实例 | ||
|
||
const parent = document.createElement("parent-wrapper"); // 创建挂载(父)节点 | ||
|
||
comp.attach(parent); // attach 到父亲节点上,此时会触发自定义组件的 attached 钩子 | ||
|
||
test("根组件计算属性初始化值(attached) ", () => { | ||
expect(comp.data.CoptionalUser).toStrictEqual(user); | ||
|
||
expect(comp.data.CoptionalUser).toStrictEqual(user); | ||
|
||
expect(comp.data.copyPropUser).toStrictEqual(user); | ||
|
||
expect(comp.data.age).toBe(30 + 1); | ||
|
||
expect(comp.data.CStoreAge).toBe(20); | ||
}); | ||
|
||
test("子组件计算属性初始化值(attached)", () => { | ||
expect(comp.data.compA_user).toStrictEqual(user); | ||
|
||
expect(comp.data.compA_num).toBe(30 + 1 + 30); | ||
}); | ||
|
||
test("data字段变化时", async () => { | ||
await sleep(100); | ||
|
||
expect(comp.data.age).toStrictEqual(30 + 2); | ||
|
||
expect(comp.data.compA_num).toBe(30 + 2 + 30); | ||
}); | ||
|
||
test("properties字段变化时", async () => { | ||
await sleep(200); | ||
|
||
expect(comp.data.CrequiredUser).toStrictEqual({ name: "zhao", age: 20 }); | ||
|
||
expect(comp.data.copyPropUser).toStrictEqual({ name: "zhao", age: 20 }); | ||
|
||
expect(comp.data.compA_user).toStrictEqual({ name: "zhao", age: 20 }); | ||
|
||
expect(comp.data.age).toBe(20 + 2); | ||
}); | ||
|
||
test("setData改变对象子字段时", async () => { | ||
await sleep(300); | ||
|
||
expect(comp.data.CoptionalUser).toStrictEqual({ name: "lili", age: 50 }); | ||
|
||
expect(comp.data.compA_num).toStrictEqual(50 + 2 + 50); | ||
}); | ||
|
||
test("store字段变化时", async () => { | ||
await sleep(400); | ||
|
||
expect(comp.data.CStoreAge).toBe(30); | ||
}); | ||
|
||
test("properties对象字段为null时", async () => { | ||
await sleep(1000); | ||
|
||
expect(comp.data.CoptionalUser).toBe(null); | ||
|
||
expect(comp.data.compA_num).toStrictEqual(0 + 2 + 0); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,124 @@ | ||
import { observable } from "mobx"; | ||
import { DefineComponent, type DetailedType, RootComponent, SubComponent } from "../../../src"; | ||
import { type CompDoc, type User, user } from "../../common"; | ||
|
||
const store = observable({ | ||
name: "zhao", | ||
age: 20, | ||
addAge(num: number) { | ||
this.age = this.age + num; | ||
}, | ||
}); | ||
|
||
const subA = SubComponent<Root, CompDoc>()({ | ||
computed: { | ||
// 5 可引用根组件properties、data和计算字段 | ||
compA_num(): number { | ||
return (this.data.optionalUser?.age || 0) + this.data.num + (this.data.CoptionalUser?.age || 0); | ||
}, | ||
// 6 可引用根组件properties、data和计算字段 | ||
compA_user(): User | null { | ||
return this.data.copyPropUser; | ||
}, | ||
}, | ||
}); | ||
|
||
type Root = typeof rootComponent; | ||
|
||
const rootComponent = RootComponent()({ | ||
properties: { | ||
requiredUser: Object as DetailedType<User>, | ||
optionalUser: { | ||
type: Object as DetailedType<User>, | ||
value: user, | ||
}, | ||
forCoverage: { | ||
type: Object as DetailedType<{ user: { user: User } }>, | ||
value: { user: { user } }, | ||
}, | ||
}, | ||
data: { | ||
num: 1, | ||
}, | ||
store: { | ||
storeAge: () => store.age, | ||
}, | ||
computed: { | ||
CforCoverage() { | ||
// 为了营造多个依赖字段去触发依赖去重而写。去重时依赖为 ["forCoverage.user.","forCoverage.user.user.age."] initComputed.ts的79-81行 | ||
this.data.forCoverage?.user; | ||
|
||
this.data.forCoverage?.user.user.age; | ||
|
||
return 123; | ||
}, | ||
/** | ||
* 7 可引用store中的数据 | ||
*/ | ||
CStoreAge() { | ||
return this.data.storeAge; | ||
}, | ||
/** | ||
* 4 可引用下面(后写)的计算属性的子字段,对应[initComputed.ts](../../../src/behaviors/BComputedAndWatch/initComputed.ts)中的 情形2 | ||
*/ | ||
age() { | ||
return (this.data.copyPropUser?.age || 20) + this.data.num; | ||
}, | ||
/** | ||
* 3 可引用下面(后写)的计算属性,对应[initComputed.ts](../../../src/behaviors/BComputedAndWatch/initComputed.ts)中的 情形1 | ||
*/ | ||
copyPropUser() { | ||
return this.data.CrequiredUser; | ||
}, | ||
// 2 计算属性可引用properties必传字段 对象类型加入null(异步对象数据默认null)。 | ||
CrequiredUser() { | ||
return this.data.requiredUser; | ||
}, | ||
// 1 计算属性可引用properties选传字段 对象类型加入null(异步对象数据默认null)。 | ||
CoptionalUser() { | ||
this.data.optionalUser?.name; | ||
|
||
this.data.optionalUser; | ||
|
||
return this.data.optionalUser; | ||
}, | ||
}, | ||
lifetimes: { | ||
attached() { | ||
setTimeout(() => { | ||
this.setData({ | ||
num: 2, | ||
}); | ||
}, 100); | ||
|
||
setTimeout(() => { | ||
this.setData({ | ||
requiredUser: { name: "zhao", age: 20 }, | ||
} as any); | ||
}, 200); | ||
|
||
// 改变对象子字段 | ||
setTimeout(() => { | ||
this.setData({ | ||
"optionalUser.age": 50, | ||
} as any); | ||
}, 300); | ||
|
||
setTimeout(() => { | ||
store.addAge(10); | ||
}, 400); | ||
|
||
setTimeout(() => { | ||
this.setData({ | ||
optionalUser: null, | ||
} as any); | ||
}, 1000); | ||
}, | ||
}, | ||
}); | ||
|
||
DefineComponent({ | ||
name: "computed", | ||
rootComponent, | ||
subComponents: [subA], | ||
}); |
File renamed without changes.
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.