• [Flux] Stores


    Store, in Flux which manager the state of the application.

    You can use EventEmiiter to listen to the change to state.

    import {dispatch, register} from '../dispatchers/app-dispatcher';
    import AppConstants from '../constants/app-constants';
    import { EventEmitter } from 'events';
    
    const CHANGE_EVENT = 'change'
    
    /**
     * Init the data: Start
     */
    var _catalog = [];
    
    for ( let i = 1; i < 9; i++ ) {
        _catalog.push( {
            'id': 'Widget' + i,
            'title': 'Widget #' + i,
            'summary': 'A great widget',
            'description': 'Lorem ipsum dolor sit amet.',
            'cost': i
        } );
    }
    
    /**
     * Init the data: End
     */
    
    
    /**
     * Manager the CRUD: Start
     */
    var _cartItems = [];
    
    const _removeItem = ( item ) => {
        _cartItems.splice( _cartItems.findIndex( i => i === item ), 1 );
    };
    
    const _findCartItem = ( item ) => {
        return _cartItems.find( cartItem => cartItem.id === item.id )
    };
    
    const _increaseItem = ( item ) => item.qty++;
    
    const _decreaseItem = ( item ) => {
        item.qty--;
        if ( item.qty === 0 ) {
            _removeItem( item )
        }
    };
    
    const _addItem = ( item ) => {
        const cartItem = _findCartItem( item );
        if ( !cartItem ) {
            _cartItems.push( Object.assign( {qty: 1}, item ) );
        }
        else {
            _increaseItem( cartItem );
        }
    };
    
    const _cartTotals = ( qty = 0, total = 0 ) => {
        _cartItems.forEach( cartItem  => {
            qty += cartItem.qty;
            total += cartItem.qty * cartItem.cost;
        } );
        return {qty, total};
    };
    
    /**
     * Manger the CRUD: END
     */
    
    
    /**
     *  AppStore Class, handle the request from dispatcher
     * @type {*}
     */
    const AppStore = Object.assign(EventEmitter.prototype, {
      emitChange(){
        this.emit( CHANGE_EVENT )
      },
    
      addChangeListener( callback ){
        this.on( CHANGE_EVENT, callback )
      },
    
      removeChangeListener( callback ){
        this.removeListener( CHANGE_EVENT, callback )
      },
    
      getCart(){
        return _cartItems;
      },
    
      getCatalog(){
        return _catalog.map(item => {
          return Object.assign( {}, item, _cartItems.find( cItem => cItem.id === item.id))
        })
      },
    
      getCartTotals(){
        return _cartTotals();
      },
    
      dispatcherIndex: register( function( action ){
        switch(action.actionType){
          case AppConstants.ADD_ITEM:
                    _addItem( action.item );
                    break;
          case AppConstants.REMOVE_ITEM:
              _removeItem( action.item );
              break;
    
          case AppConstants.INCREASE_ITEM:
              _increaseItem( action.item );
              break;
    
          case AppConstants.DECREASE_ITEM:
              _decreaseItem( action.item );
              break;
        }
    
          AppStore.emitChange();
      })
    });
    
    export default AppStore
  • 相关阅读:
    「CH6801」棋盘覆盖
    「POJ3613」Cow Relays
    「Luogu4556」Vani有约会-雨天的尾巴
    The Proof of Fibonacci GCD
    Ubuntu flatabulous 主题
    CSP-S 2019 复赛游记
    「Luogu1402」酒店之王
    HDU/5499/模拟
    cfedu/A/求和
    HDU<1372>/bfs
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4965795.html
Copyright © 2020-2023  润新知