HOOKS

aotoo-hub中,钩子系统不仅能够独立设置,同时Pager/Component中都有自己独立的钩子,钩子系统足够灵活,能够方便应对复杂的产品需求,组件间的交互等

引入hooks

钩子方法类,全局类钩子方法,该方法过于强大(哈哈),有另开篇章说明

const Pager = require('components/aotoo/core')
const hooks = Pager.hooks

创建不同的实例

// 1) 内存型实例
const hookInstence = hooks('some key')  

// 2) 内存 + localStorage
const hookInstence = hooks('some key', true)  

// 3) 内存 + 小程序 localStorage + lru缓存
// 下列设置数据超出50条后会依据算法清除老旧、无用数据
const hookInstence = hooks('some key', {
  localstorage: true,
  max: 50
})

数据部分

aotoo-hub的钩子系统是一个混合类库,参考jquery的设计,我们将数据部分融合进hooks类中

hookInstence.setItem

缓存数据

// 如果hookInstence附带localStorage,则有一份数据会保存到localStorage中
hookInstence.setItem(key, value)

// 设置有效期
const expireTime = 3 * 60 * 60 * 1000  // 3小时候过期
const expireTime = 3 * 24 * 60 * 60 * 1000  // 3天后过期
hookInstence.setItem(key, value, expireTime)

hookInstence.getItem

获取缓存数据

hookInstence.getItem(key)

hookInstence.append

追加/新建缓存数据(OBJECT/ARRAY)

hookInstence.append(key, value)

hookInstence.delete

删除指定缓存数据

hookInstence.delete(key)

钩子部分

hookInstence.on

挂载钩子方法,同一个key允许挂载多个方法

hookInstence.on(key, callback)

hookInstence.off

撤销钩子方法

// 撤销key上的所有方法
hookInstence.off(key)

// 撤销key上某一个钩子的方法
hookInstence.off(key, funName)

hookInstence.once

只允许挂一个方法,以once方法最后挂载为有效

// 撤销key上的所有方法
hookInstence.once(key, callback)

hookInstence.one

只允许挂一个方法,运行后自动销毁

// 撤销key上的所有方法
hookInstence.one(key, callback)

hookInstence.emit

执行指定的钩子,只允许传递一个JSON类型的参数

// 撤销key上的所有方法
hookInstence.emit(key, {})

hookInstence.fire

执行指定的钩子,只允许传递一个JSON类型的参数,执行完成后,销毁所有挂载方法

// 撤销key上的所有方法
hookInstence.fire(key, {})

销毁

hookInstence.destory

清除内存所有缓存数据

hookInstence.destory()

hookInstence.clear

清除内存所有缓存数据,及localstorage数据

hookInstence.clear()

跨页面调用

钩子实例一直存在在内存中,允许跨页面调用,比如在a.js, b.js, c.js三个页面中调用同一个钩子都会指向相同的实例,如下例说明

a.js

  const nHooks = lib.hooks('hooks-name-1')
  nHooks.on('hooks-keyname', function(){
    console.log('======= a.js')
  })
  require('./b.js')
  require('./c.js')

b.js

  const nHooks = lib.hooks('hooks-name-1')
  nHooks.on('hooks-keyname', function(){
    console.log('======= b.js')
  })

c.js

  const nHooks = lib.hooks('hooks-name-1')
  nHooks.emit('hooks-keyname')
  // ======= a.js
  // ======= b.js

需要按照顺序require相关文件

扩展补充

const core = require(‘components/aotoo/core’)  
const lib = core.lib  
const hooks = lib.hooks  

// 实例
const hInst = hooks(‘hooks-name’) // 纯内存
// 或者
const hInst = hooks(‘hooks-name’, true) // 附带存储storage
//前者数据仅存储在内存
//后者在前者的基础上并通过wxstorage存储在本地

// api
// 数据部分
hInst.setItem(key, val)
hInst.getItem(key)
hInst.getInfo()  // 返回该实例所有存储的数据或所有storage数据
hInst.append(key, val) // 追加数据,仅限JSON/ARRAY类型数据可以被追加
hInst.delete(key) // 删除某条数据
hInst.clear() // 强力删除数据,并等待内存回收
hInst.destory()  // 只是清除内存数据,并等待内存回收

// 钩子部分
hInst.on(key, func)
hInst.off(key)
hInst.one(key, func)
hInst.once(key, func)
hInst.emit(key, param, context)

// 订阅发布部分
hInst.fire(key, param, context)

数据操作

日常数据操作,数据的增删改查

const core = require(‘components/aotoo/core’)  
const lib = core.lib  
const hooks = lib.hooks  
const hInst = hooks(‘hooks-name’, true) // 一个钩子实例,附带存储storage

// JSON类数据
hInst.setItem('one', {title: '标题'}) // 初始化数据
hInst.append('one', {name: '张三'})  // => {title, name}
hInst.append('one', '李四')  // => {title, name: '张三', rndKey: '李四'}
hInst.getItem('one') => // => {title, name}
hInst.delete('one') // => null

// 数组型
hInst.setItem('one', ['a']) // 初始化数据
hInst.append('one', {name: '张三'})  // => ['a', {name: '张三'}]
hInst.getItem('one') => // => ['a', {name: '张三'}]
hInst.delete('one') // => null

// 其他类型数据
// append无效
hInst.setItem('one', '你好') // 初始化数据
hInst.getItem('one') => // => 你好
hInst.delete('one') // => null

打开f12的application,可以看到数据被存进了storage

钩子

日常钩子操作,挂钩子方法,触发执行钩子方法,要注意的是所有钩子方法都是同步执行

const core = require(‘components/aotoo/core’)  
const lib = core.lib  
const hooks = lib.hooks  
const hInst = hooks('hooks-name', true) // 附带存储storage

// 恒有效的钩子方法
hInst.on('oneFun', function1) //挂载钩子方法
hInst.on('oneFun', function2)
hInst.on('oneFun', function3)

// 用完即删的方法,通过one来挂载
hInst.one('oneFun', function4)

// 只允许挂一个方法,最后进入的方法会被执行
hInst.once('twoFun', function5)
hInst.once('twoFun', function6)
hInst.once('twoFun', function7) // => 只有我才会被执行

hInst.emit('oneFun', {...}, context) // 无序遍历执行function1,2,3,4
hInst.emit('twoFun', {...}) // 只有function7被执行

emit方法只允许传递一个JSON类数据, context是钩子方法执行的上下文(默认为null)

订阅/发布

日常订阅系统操作

// 恒有效的钩子方法
hInst.on('oneFun', function1) //挂载钩子方法
hInst.on('oneFun', function2)
hInst.on('oneFun', function3)
hInst.one('oneFun', function4)

hInst.fire('oneFun', {...}, context) // 遍历function1,2,3,4,所有方法用完即删

fire方法只允许传递一个JSON类数据, context是钩子方法执行的上下文(默认为null)