compx

State manager for react

Usage no npm install needed!

<script type="module">
  import compx from 'https://cdn.skypack.dev/compx';
</script>

README

CompX - Still in active development / Incomplete

Due to lack of interest and motivation, this library won't be developed any further

Very simple react state management library that uses react setState to populate a global state accessible to other components

Usage

Provider

import { Provider } from 'compx';
...
render() {
    return (
      <Provider>
        <ComponentA />
        <ComponentB />
      </Provider>
    );
}

Connect

  • ComponentA
import React, { Component } from 'react';
import {Connect} from 'compx';

class ComponentA extends Component {
    constructor(props) {
        super(props);
        this.state = {
            number: 0;
        }
    }
    render() {
        <button>Counter: {this.state.number}</button>
    }
}
export default Connect()(ComponentA);
  • ComponentB
import React, { Component } from 'react';
import {Connect} from 'compx';

class ComponentB extends Component {
    render() {
        <p>ComponentA counter is {this.props.CompX.ComponentA} </p>
    }
}
export default Connect({subscribeTo: ['ComponentA']})(ComponentB);