跳到主要内容

数据管理

这是一个用来管理数据、数据缓存、使用hook的管理工具

如果你还不了解这个工具的用途，请在入门教程中全局状态管理查看教程

示例​

import { ObjectManage } from '@/duxapp'

class UserManage extends ObjectManage {
  
  constructor() {
    super({
      cacheKey: 'userInfo',
      cache: true,
      cacheSync: true,
      defaultData: {
        // 登录状态
        status: false,
        // ...其他模块的用户信息
      }
    })
  }
}

/**
 * 实例化这个用户管理对象并且导出
 */
export const user = new UserManage()

// 设置数据
user.set({ status: true })
user.set(old => ({ ...old, status: true }))

// 在hook中取数据
const data = user.useData()

// 在非hook中取数据
const data = user.data

属性​

data​

这个字段用来存放当前实例的数据，这是一个对象，只读属性，如果你要设置它，需要使用 set()

cache​

当前实例使用的cache实例

event​

当前的事件 事件系统的实例

可以用来监听缓存读取、设置数据、清空数据

this.event.on((data, type) => {
  // type 'set' | 'cache' | 'clear' | 'no-cache'
})

方法​

ObjectManage(option)​

构造函数

名称类型必填默认值说明
cacheboolean否false是否开启缓存
cacheKeystring否保存到本地缓存中用的key
cacheSyncboolean否同步获取本地缓存 仅小程序 H5支持（警告：请只把少量的重要数据使用同步获取，例如获取用户信息，不然会导致启动缓慢）
defaultDataobject否默认data, 如果要设置默认数据，特别是cacheSync为true的情况下，一定要通过 defaultData 指定默认数据 而不是在当前类直接指定data

set(data)​

设置数据，可以使用一个回调函数，这个函数传入的参数是之前的data，这个方法不会合并data数据，你需要手动处理

名称类型必填默认值说明
dataobject | (oldData: object) => data是要设置的数据

merge(data)​

和set不同的是，你设置的数据将会和原来的数据进行简单的合并

名称类型必填默认值说明
dataobject | (oldData: object) => data是要设置的数据

clear()​

清除数据

onSet(callback, noCache, onLast)​

监听设置数据，调用 set() 的时候就会执行这个回调

名称类型必填默认值说明
callbackdata => void是回调函数
noCacheboolean否传入 true 才会返回 no-cache 类型
onLastboolean否是否监听事件的最后一条数据，在指定 cacheSync 为 true 的情况下会非常有效
this.event.onSet((data, type) => {
  // type 'set' | 'cache' | 'clear' | 'no-cache'
})

useData(key)​

使用当前的数据的hook，当用户设置数据后会自动更新

返回最新的data

需要在 React Hook 中使用

名称类型必填默认值说明
keystring否传入参数和指定使用数据的某个字段