Added readme
This commit is contained in:
parent
93d2c42770
commit
57d33c179d
2 changed files with 47 additions and 2 deletions
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "unstated-next-compose",
|
"name": "unstated-next-compose",
|
||||||
"version": "0.0.3",
|
"version": "0.0.4",
|
||||||
"description": "Simple compose provider for unstated-next",
|
"description": "Simple compose provider for unstated-next",
|
||||||
"main": "dist/compose.js",
|
"main": "dist/compose.js",
|
||||||
"umd:main": "dist/compose.umd.js",
|
"umd:main": "dist/compose.umd.js",
|
||||||
|
@ -31,6 +31,7 @@
|
||||||
"microbundle": "^0.11.0"
|
"microbundle": "^0.11.0"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"react": "^16.8.6"
|
"react": "^16.8.6",
|
||||||
|
"unstated-next": "^1.1.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
44
readme.md
Normal file
44
readme.md
Normal file
|
@ -0,0 +1,44 @@
|
||||||
|
# unstated-next-compose
|
||||||
|
|
||||||
|
Simple provider compose for [unstated-next](https://github.com/jamiebuilds/unstated-next)
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import { createContainer } from 'unstated-next';
|
||||||
|
|
||||||
|
import { Compose } from 'unstated-next-compose'; // <---
|
||||||
|
|
||||||
|
const useProvider1 = () => {
|
||||||
|
const [a, setA] = useState(0);
|
||||||
|
return { a, setA }
|
||||||
|
}
|
||||||
|
|
||||||
|
const Provider1 = createContainer(useProvider1);
|
||||||
|
|
||||||
|
const ComponentA = (props) => {
|
||||||
|
const { a, setA } = Provider1.useContainer()
|
||||||
|
return <button onClick={() => setA(a + 1)}>A={a}</button>
|
||||||
|
}
|
||||||
|
const useProvider2 = () => {
|
||||||
|
const [b, setB] = useState(0);
|
||||||
|
return { b, setB }
|
||||||
|
}
|
||||||
|
|
||||||
|
const Provider2 = createContainer(useProvider2);
|
||||||
|
|
||||||
|
const ComponentB = (props) => {
|
||||||
|
const { b, setB } = Provider2.useContainer()
|
||||||
|
return <button onClick={() => setB(b + 1)}>B={b}</button>
|
||||||
|
}
|
||||||
|
|
||||||
|
const store = [Provider1.Provider, Provider2.Provider]; // <---
|
||||||
|
|
||||||
|
export default () => (
|
||||||
|
<Compose providers={store}> // <---
|
||||||
|
<ComponentA />
|
||||||
|
<ComponentB />
|
||||||
|
</Compose>
|
||||||
|
)
|
||||||
|
```
|
Loading…
Reference in a new issue