Redux
Jotai 的状态驻留在 React 中,但有时与 React 之外的世界交互会很好。
Redux 提供了一个 store 接口,可用于存储一些值并与 Jotai 中的原子同步。
安装
您必须安装 redux
和 jotai-redux
才能使用此功能。
npm install redux jotai-redux# oryarn add redux jotai-redux
atomWithStore
atomWithStore
使用 redux store 创建一个新的 atom。
它是双向绑定,您可以双向更改值。
import { useAtom } from "jotai";import { atomWithStore } from "jotai-redux";import { createStore } from "redux";const initialState = { count: 0 };const reducer = (state = initialState, action: { type: "INC" }) => {if (action.type === "INC") {return { ...state, count: state.count + 1 };}return state;};const store = createStore(reducer);const storeAtom = atomWithStore(store);const Counter = () => {const [state, dispatch] = useAtom(storeAtom);return (<>count: {state.count}<button onClick={() => dispatch({ type: "INC" })}>button</button></>);};