塞维罗

简单、被动、小而有表演的州管理库 (仅1.5克b)

🚀 特征

• QQ 与存储对象变化反应 (被取消的属性也!)
• 简单并最小化 API
• ++ Batched 更新并优化了重排
• 懒听巢属性
• 不可改变的变化
• QQ 字型支持

📦 安装

# NPM
npm install @cervello/react

# PNPM
pnpm add @cervello/react

# YARN
yarn add @cervello/react

💻 快速使用

这是 简单, 如重新指定新值 到商店属性.
它将通知所有使用 useStore 钩入以重接新值.

// - store-example.ts
import { cervello } from '@cervello/react'

export const {
  store,       // Object with reactive changes
  useStore,    // Hook to listen for store or partial store changes
  reset,       // Function to reset the store to initial value
} = cervello({
  fullName: 'Cervello Store',
  address: {
    city: 'Huelva',
    /* ... */
  },
})


// Change value from anywhere
store.address.city = 'Sevilla'


// Listen for changes from components
function Address() {
  const { address } = useStore()
  return (<p>City: {address.city}</p>)
}


// Just listen for changes in the `city` property
const AddressWithSelector = () => {
  const { address } = useStore({
    select: ['address.city']
  })

  return (<p>City: {address.city}</p>)
}

💡 很高兴知道

• 已选中更改:变异被联合并冲出每个微任务一次. onChange编号 :afterChange 以数组方式接收整批( 不要变异—— 它可能由订阅者共享) .
• 没有虚假的更新: 指定内容等值(同样是原始的,或具有相同内容的平面对象——密钥顺序并不重要)不会通知或重交. 阵列, nonReactive 对象和反应元素总是通知。 一个在写完之后已经制作的组件(例如调用操作器) setState 然后写到店里)不会因为那封信而再次被重新发回.
• 嵌入对象为活视图数字 : const { address } = useStore() (或 const a = store.address)继续指向商店的当前数据,即使在之后 store.address = {...}, (中文(简体) ), store.$value = {...} 或者说 reset(),所以通过它写 总是更新商店。 如果其路径停止为对象(store.address = null),通过旧的手柄写出.
• $value 总是复制: 读取 store.$value 返回深克隆,并 store.$value = obj (比如说) cervello(obj) 财务报告和审定财务报表 reset()(a) 储存一个深层克隆体 obj - 变异 obj 之后不会碰商店。 偏爱 { ...store.$value, x } 结束 { ...store, x } 当建立新值时.
• 热组件: 通过 select: ['path', 'nested.*'] 改为 useStore 因此组件只为这些路径重新发回;没有它,它就重新发回每个商店的更改. 准确路径符合他们自己的写作; 'address.*' 也匹配任何嵌入在下面的东西 address当 祖先 重新分配(store.address = {...}, (中文(简体) ), store.$value = {...} 或者说 reset()),所选切片按内容进行对比,如果内容实际改变,则组件只能重递. 规则:一个组成部分只须 读取 它所选择的路径 —— 一个在渲染中读取的非选中的字段永远不会被刷新 .
• afterChange 每次排放的起火量: 字段写作,全层替换( )store.$value = ..., (中文(简体) ), reset()和 initialValue 种子——内容平等写作从不放出,所以他们也从不放出. 对于种子来说,它被推迟到一个微任务(从未在反应渲染中). 用户( E)onChange),投出不会阻止其他订阅者,也不会后期更新:错误是同步重投.
• 严格模式数字 : initialValue c. 具有下列特性之一: setValueOnMount 运行在每个效果上架, 每个React的合同.
• 安全部门改革:该商店是模块范围. 按要求隔离,打电话 cervello() 通过上下文分享.
• 复杂值 (单位:千美元)Date, (中文(简体) ), Map, (中文(简体) ), Set,类例,循环参考:用 nonReactive(...) ——保存完好(并被修复) reset())但不要引发反应.

更多深度解释或API参考文献和更多实例: 文档网站

由 Typescript 创建 ! @ @ @ 和 latin 音乐 @