ZIPredux-0.6.2.zip 17.09KB

a3737337

资源文件列表:

redux-0.6.2.zip 大约有46个文件
  1. redux-0.6.2/
  2. redux-0.6.2/.babelrc 43B
  3. redux-0.6.2/.eslintrc 349B
  4. redux-0.6.2/.gitignore 40B
  5. redux-0.6.2/.jshintrc 75B
  6. redux-0.6.2/.npmignore 13B
  7. redux-0.6.2/LICENSE 1.05KB
  8. redux-0.6.2/README.md 6.47KB
  9. redux-0.6.2/TODO 148B
  10. redux-0.6.2/examples/
  11. redux-0.6.2/examples/counter/
  12. redux-0.6.2/examples/counter/App.js 530B
  13. redux-0.6.2/examples/counter/Counter.js 517B
  14. redux-0.6.2/examples/counter/actions/
  15. redux-0.6.2/examples/counter/actions/CounterActions.js 542B
  16. redux-0.6.2/examples/counter/constants/
  17. redux-0.6.2/examples/counter/constants/ActionTypes.js 108B
  18. redux-0.6.2/examples/counter/stores/
  19. redux-0.6.2/examples/counter/stores/counterStore.js 308B
  20. redux-0.6.2/examples/counter/stores/index.js 43B
  21. redux-0.6.2/examples/index.html 157B
  22. redux-0.6.2/examples/index.js 206B
  23. redux-0.6.2/examples/server.js 420B
  24. redux-0.6.2/examples/todo/
  25. redux-0.6.2/examples/todo/App.js 303B
  26. redux-0.6.2/examples/todo/Body.js 424B
  27. redux-0.6.2/examples/todo/Header.js 443B
  28. redux-0.6.2/examples/todo/actions/
  29. redux-0.6.2/examples/todo/actions/index.js 133B
  30. redux-0.6.2/examples/todo/constants/
  31. redux-0.6.2/examples/todo/constants/ActionTypes.js 35B
  32. redux-0.6.2/examples/todo/stores/
  33. redux-0.6.2/examples/todo/stores/index.js 321B
  34. redux-0.6.2/examples/webpack.config.js 742B
  35. redux-0.6.2/package.json 1.31KB
  36. redux-0.6.2/scripts/
  37. redux-0.6.2/scripts/build 65B
  38. redux-0.6.2/src/
  39. redux-0.6.2/src/Container.js 2.61KB
  40. redux-0.6.2/src/Root.js 669B
  41. redux-0.6.2/src/addons/
  42. redux-0.6.2/src/addons/container.js 980B
  43. redux-0.6.2/src/addons/getDisplayName.js 119B
  44. redux-0.6.2/src/addons/root.js 448B
  45. redux-0.6.2/src/createDispatcher.js 3.44KB
  46. redux-0.6.2/src/index.js 207B

资源介绍:

一个可预测的全局状态管理的 JS 库 A JS library for predictable global state management
redux ========================= An experiment in fully hot-reloadable Flux. **The API might change any day.** _**Don't use in production.**_ ## Why another Flux framework? Read **[The Evolution of Flux Frameworks](https://medium.com/@dan_abramov/the-evolution-of-flux-frameworks-6c16ad26bb31)** for some context. ### Design Goals * Hot reloading of everything. * A hook for the future devtools to "commit" a state, and replay actions on top of it during hot reload. * No `createAction`, `createStores`, `wrapThisStuff`. Your stuff is your stuff. * I don't mind action constants. Seriously. * Keep Flux lingo. No cursors or observables in core. * Have I mentioned hot reloading yet? ## Demo <img src='https://s3.amazonaws.com/f.cl.ly/items/2Z2D3U260d2A311k2B0z/Screen%20Recording%202015-06-03%20at%2003.22%20pm.gif' width='500'> ``` git clone https://github.com/gaearon/redux.git redux cd redux npm install npm start ``` ## What's it look like? ### Actions ```js // Still using constants... import { INCREMENT_COUNTER, DECREMENT_COUNTER } from '../constants/ActionTypes'; // But action creators are pure functions returning actions export function increment() { return { type: INCREMENT_COUNTER }; } export function decrement() { return { type: DECREMENT_COUNTER }; } // Can also be async if you return a function // (wow, much functions, so injectable :doge:) export function incrementAsync() { return dispatch => { setTimeout(() => { dispatch(increment()); }, 1000); }; } // Could also look into state in the callback form export function incrementIfOdd() { return (dispatch, state) => { if (state.counterStore % 2 === 0) { return; } dispatch(increment()); }; } ``` ### Stores ```js // ... too, use constants import { INCREMENT_COUNTER, DECREMENT_COUNTER } from '../constants/ActionTypes'; // what's important is that Store is a pure function, // and you can write it anyhow you like. // the Store signature is (state, action) => state, // and the state shape is up to you: you can use primitives, // objects, arrays, or even ImmutableJS objects. export default function counterStore(counter = 0, action) { // this function returns the new state when an action comes switch (action.type) { case INCREMENT_COUNTER: return counter + 1; case DECREMENT_COUNTER: return counter - 1; default: return counter; } // BUT THAT'S A SWITCH STATEMENT! // Right. If you hate 'em, see the FAQ below. } ``` ### Components #### Dumb Components ```js // The dumb component receives everything using props: import React, { PropTypes } from 'react'; export default class Counter { static propTypes = { counter: PropTypes.number.isRequired, increment: PropTypes.func.isRequired, decrement: PropTypes.func.isRequired }; render() { const { counter } = this.props; return ( <p> Clicked: {counter} times </p> ); } } ``` #### Smart Components ```js // The smart component may inject actions // and observe stores using <Container />: import React, { Component } from 'react'; import { Root, Container } from 'redux'; import { increment, decrement } from './actions/CounterActions'; import counterStore from './stores/counterStore'; import Counter from './Counter'; export default class CounterContainer { render() { // stores and actions must both be string -> function maps. // props passed to children will combine these actions and state. return ( <Container stores={{ counter: stores.counterStore }} actions={{ increment, decrement }}> {/* Yes this is a function as a child. Bear with me. */} {({ state, actions }) => <Counter {...state} {...actions} />} </Container> ); } } ``` #### Decorators Don't want to separate dumb and smart components just yet? Use the decorators! They work exactly the same as the container components, but are lowercase: ```js import React, { PropTypes } from 'react'; import { increment, decrement } from './actions/CounterActions'; import { container } from 'redux'; import counterStore from './stores/counterStore'; @container({ actions: { increment, decrement }, stores: { counter: counterStore } }) export default class Counter { static propTypes = { increment: PropTypes.func.isRequired, decrement: PropTypes.func.isRequired, counter: PropTypes.number.isRequired }; render() { return ( <p> Clicked: {this.props.counter} times {' '} <button onClick={() => this.props.increment()}>+</button> {' '} <button onClick={() => this.props.decrement()}>-</button> </p> ); } } ``` #### The root component ```js import React from 'react'; import { root } from 'redux'; import * as stores from './stores/index'; // Let it know about all the stores @root(stores) export default class App { /* ... */ } ``` ## FAQ ### How does hot reloading work? * http://webpack.github.io/docs/hot-module-replacement.html * http://gaearon.github.io/react-hot-loader/ * Literally that's it. Redux is fully driven by component props, so it works on top of React Hot Loader. ### Can I use this in production? I wouldn't. Many use cases are not be considered yet. If you find some use cases this lib can't handle yet, please file an issue. ### But there are switch statements! `(state, action) => state` is as simple as a Store can get. You are free to implement your own `createStore`: ```js export default function createStore(initialState, handlers) { return (state = initialState, action) => handlers[action.type] ? handlers[action.type](state, action) : state; } ``` and use it for your Stores: ```js export default createStore(0, { [INCREMENT_COUNTER]: x => x + 1, [DECREMENT_COUNTER]: x => x - 1 }); ``` It's all just functions. Fancy stuff like generating stores from handler maps, or generating action creator constants, should be in userland. Redux has no opinion on how you do this in your project. ### What about `waitFor`? I wrote a lot of vanilla Flux code, and my only use case for it was avoiding emitting a change before a related Store consumes the action. In Redux this doesn't matter because the change is only emitted after *all* Stores have consumed the action. If several of your Stores want to read data from each other and depend on each other, it's a sign they should've been a single Store instead. [See this discussion on how `waitFor` can be replaced by the composition of stateless Stores.](https://gist.github.com/gaearon/d77ca812015c0356654f)
100+评论
captcha
    相关资源
    类型标题大小时间
    ZIPredux-0.6.0.zip16.98KB8月前
    ZIPredux-0.6.1.zip16.99KB8月前
    ZIPredux-0.7.0.zip17.21KB8月前
    ZIPredux-0.10.0.zip32.1KB8月前
    ZIPredux-0.5.1.zip16.21KB8月前
    ZIPredux-0.5.2.zip20.91KB8月前
    ZIPredux-0.5.3.zip21.01KB8月前
    ZIPalgorithm-journey-main.zip7.3MB8月前