stattyReact 状态管理库
statty 是一个小巧而又不引人注目的,用于 React 和 Preact 应用程序的状态管理库。
使用方法:
// https://codesandbox.io/s/rzpxx0w34 import React from 'react' import { render } from 'react-dom' import { Provider, State } from 'statty' import inspect from 'statty/inspect' // selector is a function that returns a slice of the state // if not specified it defaults to f => f const selector = state => ({ count: state.count }) // updaters // updaters MUST be pure and return a complete new state, // like Redux reducers const onDecrement = state => Object.assign({}, state, { count: state.count - 1 }) const onIncrement = state => Object.assign({}, state, { count: state.count + 1 }) // Counter uses a <State> component to access the state // and the update function used to execute state mutations const Counter = () => ( <State select={selector} render={({ count }, update) => ( <div> <span>Clicked: {count} times </span> <button onClick={() => update(onIncrement)}>+</button>{' '} <button onClick={() => update(onDecrement)}>-</button>{' '} </div> )} /> ) // initial state const initialState = { count: 0 } // The <Provider> component is supposed to be placed at the top // of your application. It accepts the initial state and an inspect function // useful to log state mutatations during development // (check your dev tools to see it in action) const App = () => ( <Provider state={initialState} inspect={inspect}> <Counter /> </Provider> ) render(<App />, document.getElementById('root'))
评论
marty.jsReact 状态管理库
marty.js用来为React应用提供状态管理的JavaScript库,实现了Fluxarchitecture.定义了一组规则用来管理应用的状态。Flux是Facebook推出的用来帮助他们自己构建
marty.jsReact 状态管理库
0
React FreezeReact 状态管理库
ReactFreeze是一个React状态管理库,可有效避免React的re-render,在不丢失组件和页面状态的情况下冻结组件树并将其替换为占位视图。值得注意的是,虽然冻结的组件树被替换为占位视图
React FreezeReact 状态管理库
0