https://github.com/allain/observable-react-state

https://github.com/allain/observable-react-state

Last synced: 16 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/allain/observable-react-state
• Owner: allain
• Created: 2018-03-09T15:31:04.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2018-03-09T18:09:04.000Z (almost 7 years ago)
• Last Synced: 2024-12-21T02:41:15.577Z (about 1 month ago)
• Language: JavaScript
• Size: 43 KB
• Stars: 1
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# observable-react-state

> An observable state implementation based on React's Component State approach.

[![NPM](https://img.shields.io/npm/v/observable-react-state.svg)](https://www.npmjs.com/package/observable-react-state)

## Install

```bash

npm install --save observable-react-state

```

## Usage

```jsx

// @flow

import ObservableReactState from 'observable-react-state'

// Flow type applied to state property

type CounterStateType = {

  count: number

}

class CounterState extends ObservableReactState {

  state = {

    count: 0

  }

  increment() {

    // setState with an object

    this.setState({count: this.state.count + 1})

  }

  decrement() {

    // setState with a function

    this.setState(state => ({...state, count: state.count - 1}))

  }

}

const counter = new CounterState()

// Because it's an observable

counter.subscribe(() => console.log('count', counter.state.count)

counter.increment()

counter.decrement()

```

## License

ISC © [allain](https://github.com/allain/observable-react-state)