@cohook/core

框架无关、轻量级、渐进式的不可变数据管理方案

✨特性

• 读写分离，自定义Action去处理数据，灵活化组装实现逻辑复用
• 轻量，API简单化，类型提示友好
• 数据不可变, 使用immer管理数据
• 支持插件化拓展功能

📦 安装

yarn add @cohook/core immer

npm i @cohook/core immer

💡API

createContainer(initialData [, option])

createContainer作为容器工厂函数，接收初始数据initialData和可选的插件选项pluginsOption和共享选项shareOption等配置，返回一个容器对象container。

pluginsOption

插件选项是一个对象，key为插件名，value为插件方法具体实现。

⚠️ 为了插件的更简便实现，改写了插件方法的this参数，因此插件方法不能用箭头函数

• this: PluginContext<T>

🌰

• loggerPlugin

function loggerPlugin() {
  this.tryToTrackEffect({
    effectHook: (option) => {
      logToMyService(option)
    }
  })
}

• useMapDataToStatePlugin

shareOption

共享选项配置常用于跨应用(或窗口)共享容器，包括提供者shareProvider和消费者shareConsumer两个配置:

🌰

// 跨iframe共享容器
const getSharedOption: () => ShareOption<T> = () => {
  const scopeName = Symbol.for('__scopeName__')

  return window.top === window ? {
    shareProvider: container => window[scopeName] = container
  } : {
    shareConsumer: () => window.top[scopeName]
  }
}

const container = createContainer(initialData,  getSharedOption())

container

container.getData()

用于获取当前的容器数据，就像是一个内置的action，可在任何地方使用。

container.commit(updater)

commit 接受一个函数updater（immer中的produce的第二个参数保持一致）作为参数，用来创建修改数据的Action，可灵活组合容器对象提供的方法来组装Action。

const dec = () => {
  const count = container.getData()
  if(count < 0) return
  container.commit((draft) => void (draft.current -= 1)
}