执行时机配置

storact对dispatch的触发时机做了扩展,通过dispatch.config方法来调用,如下

const newDispatch = dispatch.config(arg)

// dispatch.config会返回一个新的dispatch方法

arg包含以下属性

1. delay

配置延迟执行,可设置一个毫秒数字,控制延迟时间

const delayDispatch = dispatch.config({ delay: 2000 })
delayDispatch.push(['member'], { name: 'XXX' }) // 延迟2秒执行

2. debounce

防抖,可设置一个毫秒数字,控制防抖的时间间隔,针对action的type相同的(一般针对同一个effect,内置的reducer像'update'、'push'等,不推荐使用)

// 2秒防抖
const debounceDispatch = dispatch.config({ debounce: 2000 })

// 由于下面还有执行addMmber的dispatch,这一个将被忽略
debounceDispatch.addMember('XXX', 2) 

debounceDispatch.addMember('XXX', 2) // 2秒之后执行

3. throttle

节流,可设置一个毫秒数字,控制节流的时间间隔,针对action的type相同的(一般针对同一个effect,内置的reducer像'update'、'push'等,不推荐使用)

// 2秒节流
const throttleDispatch = dispatch.config({ throttle: 2000 })

throttleDispatch.addMember('XXX', 2) // 立即执行

// 由于上一个addMember会节流锁定2秒,当前这个将被忽略
throttleDispatch.addMember('XXX', 2) 

4. pend

挂起,设置为true便可开启这个配置,针对同一个effect,并且涉及到异步(获取异步数据、执行延迟的dispatch、甚至等待用户确认操作等)的,在上一个effect为执行完成之前,会阻断并丢弃后边相同的effect的执行

// 2秒节流
const pendDispatch = dispatch.config({ pend: true })

pendDispatch.addCloudMember() // 立即执行(假装这里会动态获取用户信息)
pendDispatch.addCloudMember() // 上一个没执行完,这一个会被忽略

Last updated

Was this helpful?