jz-next-store

特性

• ✅ 自动 localStorage 持久化，无需额外插件
• ✅ 全局单例 Store，多处引入共享状态
• ✅ 完整 TypeScript 类型支持，类型推导友好
• ✅ 超轻量，体积极小，零冗余代码
• ✅ 支持按需清空持久化缓存

[!WARNING]

1. 模仿 pinia 实现的轻量全局状态管理
2. 实现不一样，在使用的时候不能省略 .value
3. 结构赋值不会丢失响应式
4. 使用前，请认真阅读下面的示例文档

安装

pnpm add jz-next-store

使用

import { useDefineStore } from 'jz-next-store'

const useTestStore = useDefineStore("test", () => {
  // 状态
  const count = ref(0)

  const hobbies = ref<string[]>([])

  // 修改状态
  const increment = () => {
    count.value++
  }

  return {
    count,
    hobbies,
    increment
  }
})

const testStore = useTestStore()

// 访问状态
console.log(testStore.count.value)

// 修改状态
testStore.increment()

// 解构赋值
const { hobbies } = testStore

hobbies.value.push("唱")
hobbies.value.push("跳")
hobbies.value.push("rap")
hobbies.value.push("篮球")

持久化

配置第三个参数，自动持久化

import { useDefineStore } from 'jz-next-store'

const store = useDefineStore("key", () => {
  // 状态
  const count = ref(0)

  return { count }
}, [ "count" ])

联系我

微信：putongren312