Skip to content

Commit 5dc2717

Browse files
author
boquanfu
committed
docs: update main docs for v5
1 parent e142133 commit 5dc2717

File tree

3 files changed

+39
-71
lines changed

3 files changed

+39
-71
lines changed

README.md

Lines changed: 30 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@
44

55
> 此 behavior 依赖开发者工具的 npm 构建。具体详情可查阅[官方 npm 文档](https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html)
66
7-
注意: 4.0.0 大版本变更了最基本的接口名,升级到 4.0.0 以上时请注意 [#60](https://github.com/wechat-miniprogram/computed/issues/60) 的问题。旧版文档可以参考对应版本的 git tag 中的 README ,如 [v3.1.1](https://github.com/wechat-miniprogram/computed/tree/v3.1.1) tag
7+
注意: 4.0.0 大版本变更了最基本的接口名,从低版本升级到 4.0.0 以上时请注意 [#60](https://github.com/wechat-miniprogram/computed/issues/60) 的问题。
88

99
## 使用方法
1010

1111
### 方式一 代码片段
1212

13-
需要小程序基础库版本 >= 2.6.1 的环境。
13+
需要小程序基础库版本 >= 2.11.0 的环境。
1414

1515
可以直接体验一下这个代码片段,它包含了基本用法示例:[https://developers.weixin.qq.com/s/4KYn6TmJ7osP](https://developers.weixin.qq.com/s/4KYn6TmJ7osP)
1616

@@ -120,7 +120,33 @@ Component({
120120
<button bindtap="onTap">click</button>
121121
```
122122

123-
### TypeScript 支持
123+
### glass-easel Chaining API 支持
124+
125+
使用 glass-easel Chaining API 时,可以用更友好的 `computed` `watch` 函数。
126+
127+
```js
128+
import { computed, watch } from 'miniprogram-computed'
129+
130+
Component()
131+
.data(() => ({
132+
a: 1,
133+
b: 2,
134+
}))
135+
.init((ctx) => {
136+
const data = computed(ctx, {
137+
c: (data) => data.a + data.b,
138+
d: (data) => data.a * 2,
139+
}, {
140+
e: (data) => data.c + data.d,
141+
})
142+
watch(ctx, 'a, b', (a: number, b: number) => {
143+
// ...
144+
})
145+
})
146+
.register()
147+
```
148+
149+
### 非 chaining API 的 TypeScript 支持
124150

125151
由于通过 behavior 的方式引入不能获得类型支持, 因此为了获得类型的支持, 可以使用一个辅助组件构造器:
126152

@@ -162,65 +188,6 @@ ComponentWithComputed({
162188

163189
针对此问题,推荐使用 `ComponentWithComputed` 构造器代替 `Component` 构造器。
164190

165-
**关于类型声明**
166-
167-
`4.0.5` 版本之前,并未提供相关的 `.d.ts` 类型声明。
168-
169-
强烈建议将 `miniprogram-computed` npm 包依赖升级至 `^4.0.5` 已获取完整的类型能力。
170-
171-
### glass-easel Chaining API 支持
172-
173-
使用 glass-easel Chaining API 时,可以用更友好的 `computed` `watch` 函数。
174-
175-
```js
176-
import { computed, watch } from 'miniprogram-computed'
177-
178-
Component()
179-
.data(() => ({
180-
a: 1,
181-
b: 2,
182-
}))
183-
.init((ctx) => {
184-
const data = computed(ctx, {
185-
c: (data) => data.a + data.b,
186-
})
187-
watch(ctx, 'a, b', (a: number, b: number) => {
188-
// ...
189-
})
190-
})
191-
.register()
192-
```
193-
194-
## ^4.0.0 与 ^1.0.0、 ^2.0.0、 ^3.0.0 版本的差异
195-
196-
### ^4.0.0 版本
197-
198-
- 变更了最基本的接口。
199-
200-
- 新增简单的 TypeScript 支持。
201-
202-
### ^3.0.0 版本
203-
204-
- 支持 mobx-miniprogram 扩展库引入的数据段。
205-
206-
- 对自定义 behavior 数据段使用 computed 时,支持在初始化视图中进行数据渲染。
207-
208-
- 基于 proxy 更新了 computed 数据追踪的实现方式,computed 依赖的数据路径追踪初始化操作,延后到组件的 created 阶段 。
209-
210-
### ^2.0.0 版本
211-
212-
基于小程序基础库 2.6.1 开始支持的 observers 定义段实现,具有较好的性能。
213-
214-
以下是版本之间主要区别的比较。
215-
216-
| 项目 | ^1.0.0 | ^2.0.0 | ^3.0.0 和 ^4.0.0 |
217-
| ----------------------------------------------- | --------------- | ------------- | ---------------- |
218-
| 支持的基础库最低版本 | 2.2.3 | 2.6.1 | 2.6.1 |
219-
| 支持 `watch` 定义段 ||||
220-
| 性能 | 相对较差 | 相对较好 | 相对较好 |
221-
| 支持 `mobx-miniprogram` 扩展库 | 不支持 | 不支持 | 支持 |
222-
| 支持自定义 `behavior` 数据字段 / 初始化视图渲染 | 不支持 / 不支持 | 支持 / 不支持 | 支持 / 支持 |
223-
224191
## 常见问题说明
225192

226193
### 我应该使用 computed 还是 watch ?
@@ -235,7 +202,7 @@ Component()
235202

236203
### 关于 \*\* 通配符
237204

238-
`watch` 字段上可以使用 `**` 通配符,是它能够监听这个字段下的子字段的变化(类似于小程序基础库本身的 observers )。
205+
`watch` 字段上可以使用 `**` 通配符,它能够监听这个字段下的子字段的变化(类似于小程序基础库本身的 observers )。
239206

240207
```js
241208
const computedBehavior = require('miniprogram-computed').behavior
@@ -269,7 +236,3 @@ Component({
269236

270237
- 对于没有使用 `**` 通配符的字段,在 `watch` 检查值是否发生变化时,只会进行粗略的浅比较(使用 `===` );
271238
- 对于使用了 `**` 通配符的字段,则会进行深比较,来尝试精确检测对象是否真的发生了变化,这要求对象字段不能包含循环(类似于 `JSON.stringify` )。
272-
273-
### 关于低版本兼容
274-
275-
对于 IOS `9.3` 以下的版本,由于无法原生支持 `Proxy`,这里会使用 `proxy-polyfill` 去代替。

UPDATE.md

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,15 +25,20 @@
2525
- 使用 TypeScript 重构。
2626
- 优化部分生命周期逻辑。
2727

28-
# 4.1.1
28+
## 4.1.1
2929

3030
- 优化打包方式
3131
- 优化 dev 开发流程
3232

33-
# 4.2.x
33+
## 4.2.x
3434

3535
- 增加 polyfill
3636

37-
# 4.3.x
37+
## 4.3.x
3838

3939
- 修复引用类型的部分问题
40+
41+
## 5.0.0
42+
43+
- 基于 glass-easel 重构
44+
- 支持 chaining API

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "miniprogram-computed",
3-
"version": "5.0.0-alpha.1",
3+
"version": "5.0.0",
44
"description": "Computed & watch - wechat miniprogram custom component extend behavior",
55
"main": "dist/index.js",
66
"types": "types/index.d.ts",

0 commit comments

Comments
 (0)