写文章
  1. 犀牛前端部落首页
  2. 资讯杂谈

使用zustand管理React State

犀牛前端部落 • 2019年12月5日 pm1:56 • 资讯杂谈 • 阅读 1908

使用zustand管理React State

首先我们看一下zustand的官方介绍：

Small, fast and scaleable bearbones state-management solution. Has a comfy api based on hooks, that isn’t boilerplatey or opinionated, but still just enough to be explicit and flux-like.

使用例子：

import create from 'zustand'
//创建一个store
const [useStore] = create(set => ({
  count: 1,
  inc: () => set(state => ({ count: state.count + 1 })),
  dec: () => set(state => ({ count: state.count - 1 })),
}))

function Counter() {
  const { count, inc, dec } = useStore()//绑定到组件
  return (
    <>
      <h1>{count}</h1>
      <button onClick={inc}>up</button>
      <button onClick={dec}>down</button>
    </>
  )
}

使用npm/yarn安装

npm install zustand

更多使用方式：

github链接

原创文章，作者：犀牛前端部落，如若转载，请注明出处：https://www.pipipi.net/2831.html

赞 (0)
犀牛前端部落 犀牛前端部落 管理团队
0 0
JSON.stringify() 可选参数的作用
« 上一篇 2019年12月5日 pm1:48
将list-style-type修改为任意的字符
下一篇 » 2019年12月5日 pm2:03

相关推荐

发表评论

登录后才能评论