TeafulReact 状态管理工具
Teaful 是一个强大易用且非常轻量的 React 状态管理工具。
主要特性
-
轻量:在 React 和 Preact 中实现状态管理只需要不到 1kb 的包体积
-
易用:不需要 actions、reducers、selectors、connect、providers 等概念,一切都可以用简单且舒适的方式来实现
-
强大:当 store 中的属性更新时,只有消费了这一属性的组件会重新渲染,消费了 store 中其他属性的组件不会重新渲染
使用方式也非常有意思:
import createStore from "teaful";
const { useStore } = createStore({
username: "Aral",
count: 0,
age: 31,
cart: {
price: 0,
items: [],
},
});
function Example() {
const [username, setUsername] = useStore.username();
const [cartPrice, setCartPrice] = useStore.cart.price();
return (
<>
<button onClick={() => setUsername("AnotherUserName")}>
Update {username}
</button>
<button onClick={() => setCartPrice((v) => v + 1)}>
Increment price: {cartPrice}€
</button>
</>
);
}
评论