DEV Community

Cover image for Using Redux GET - PUSH
Juan
Juan

Posted on

Using Redux GET - PUSH

Getting started

npm install redux-js;
Enter fullscreen mode Exit fullscreen mode

or

yarn add redux-js;
Enter fullscreen mode Exit fullscreen mode

Usage

import redux from redux-js";
Enter fullscreen mode Exit fullscreen mode

Add your initial storage in the index of your project

Initial state settings, example

redux.store({
  environment:env,
  storage_cache:[],
  requests_executed:[],
  path:'',
  sessions:{},
  authorize:{},
  pag_count:10, 
  pag_position:'top', 
  list_type:'table'
});
Enter fullscreen mode Exit fullscreen mode

Insert data

redux.push('sessions', {username:jc, data:'example'});
Enter fullscreen mode Exit fullscreen mode

Insert data and store in localstorage

redux.push('sessions', {username:jc, data:'example'}, true);
Enter fullscreen mode Exit fullscreen mode

Query data

redux.get('sessions');
Enter fullscreen mode Exit fullscreen mode

Query data, if it is true query the localstorage

redux.get('sessions', true);
Enter fullscreen mode Exit fullscreen mode

Remove from localstorage

redux.remove('sessions');
Enter fullscreen mode Exit fullscreen mode

See all data

redux.all();
Enter fullscreen mode Exit fullscreen mode

React Event listener, using hooks

useEffect(() => {

  const unsubscribe = redux.subscribe( () => {
    //Use 'is' or 'current'

    //Using is return boolean
    if(redux.is('sessions')){
      console.log('It is my event');
    }

    //Using current return string
    if(redux.current()==='sessions'){
      console.log('It is my event');
    }
  });
  return () => {
    unsubscribe();
  }
}, []);
Enter fullscreen mode Exit fullscreen mode

React Event listener, using class

componentDidMount = () => {
  this.unsubscribe = redux.subscribe( () => {
    //Use 'is' or 'current'

    //Using is return boolean
    if(redux.is('sessions')){
      console.log('It is my event');
    }

    //Using current return string
    if(redux.current()==='sessions'){
      console.log('It is my event');
    }
  });
};

componentWillUnmount = () => {
  this.unsubscribe();
};
Enter fullscreen mode Exit fullscreen mode

Discussion (1)

Collapse
jcarrizalez profile image
Juan Author

Este paquete ayudará a quien no sepa usar redux,