https://github.com/pixelscommander/quickcontext

ContextAPI state management made Easy. Less code more performance.
https://github.com/pixelscommander/quickcontext

Last synced: 10 months ago
JSON representation

ContextAPI state management made Easy. Less code more performance.

• Host: GitHub
• URL: https://github.com/pixelscommander/quickcontext
• Owner: PixelsCommander
• Created: 2019-09-12T16:55:32.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2019-10-14T20:20:42.000Z (over 6 years ago)
• Last Synced: 2024-10-30T08:26:12.826Z (over 1 year ago)
• Language: JavaScript
• Size: 182 KB
• Stars: 1
• Watchers: 3
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# QuickContext

> ContextAPI state management made easy

[![NPM](https://img.shields.io/npm/v/quickcontext.svg)](https://www.npmjs.com/package/quickcontext) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash

npm install --save quickcontext

```

## Usage

Changing values in a context as simple as:

```tsx

this.context.store.value = newValue;

```

Your context module:

```tsx

import {createContext} from 'quickcontext';

const eContext = createContext({

  clicks: 0,

});

export const Context = eContext.Context;

export const Consumer = eContext.Consumer;

export const Provider = eContext.Provider;

```

Your app:

```tsx

import {Provider} from './Context';

import {Component} from './Component';

export const App = () =>

  

    

  

```

Your component:

```tsx

import React from 'react';

import {Context} from './Context';

export class Component extends React.Component {

  click = () => this.context.store.clicks = Math.random()

  render() {

    return 

      

      Clicked: {this.context.store.clicks}


    

  }

}

Component.contextType = Context;

```

For more information have a look at example.

## License

MIT © [PixelsCommander](https://github.com/PixelsCommander)