# react-data-store

> React state container with Decorator

Latest version **0.0.5** (published 2017-02-07) · ISC license · 0 weekly downloads

## Install

```sh
npm install react-data-store
pnpm add react-data-store
yarn add react-data-store
bun add react-data-store
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.5 |
| Published | 2017-02-07 |
| First published | 2017-02-07 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | toy |
| Maintainers | mrtoy |
| Keywords | flux, decorator, store, publish, subscribe, live, hot, functional, predictable, state, reducer |

## Links

- npm: https://www.npmjs.com/package/react-data-store
- Repository: https://github.com/MrToy/react-data-store
- Homepage: https://github.com/MrToy/react-data-store#readme
- Issues: https://github.com/MrToy/react-data-store/issues
- npm.io page: https://npm.io/package/react-data-store

## Alternatives

- [@reckona/mreact-store](https://npm.io/package/@reckona/mreact-store.md) — 976 weekly downloads
- [regular-state](https://npm.io/package/regular-state.md) — 410 weekly downloads
- [@pacote/flux-actions](https://npm.io/package/@pacote/flux-actions.md) — 65 weekly downloads
- [@pilotlab/lux-debug](https://npm.io/package/@pilotlab/lux-debug.md) — 39 weekly downloads
- [vue-persist-state](https://npm.io/package/vue-persist-state.md) — 19 weekly downloads

## Recent versions

- 0.0.5 (latest) — 2017-02-07
- 0.0.4 — 2017-02-07
- 0.0.3 — 2017-02-07

## README

# react-data-store

react-data-store is a state manager for React

##installation

	npm install --save react-data-store
	
##How it works

It will map your store properties to component

First,Create one of store.js

```js
import {createStore} from 'react-data-store'

export default createStore(setState=>{
	return {
		name:"toy",
		info:{
			thumb:null
		},
		login(id,pass){
			setState({name:"other"})
		}	
	}
})
```

then, bind it to your component.js

```js
import React from 'react'
import store from './store.js'
import {withStore} from 'react-data-store'

@withStore({store})
class Main extends React.Component{
	render(){
		let {key,onchange}=this.props.store
		return(
			<div>
				<div>{key}</div>
				<button onClick={onchange}>Click me!</button>
			</div>
		)
	}
}

export default Main
```



##If with pure function Component

```js
const Main=withStore({store})(props=>(
	<div>
		<div>{props.key}</div>
		<button onClick={props.onchange}>Click me!</button>
	</div>
))
```

---
_Source: https://npm.io/package/react-data-store · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._