Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dobjs/dob-redux
bind dob to redux!
https://github.com/dobjs/dob-redux
dob dob-redux redux
Last synced: 25 days ago
JSON representation
bind dob to redux!
- Host: GitHub
- URL: https://github.com/dobjs/dob-redux
- Owner: dobjs
- License: mit
- Created: 2017-11-02T08:44:38.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2017-11-13T06:59:30.000Z (about 7 years ago)
- Last Synced: 2024-11-17T10:42:15.770Z (about 2 months ago)
- Topics: dob, dob-redux, redux
- Language: TypeScript
- Homepage:
- Size: 647 KB
- Stars: 6
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
- License: LICENSE
Awesome Lists containing this project
README
# Dob-redux · [](https://travis-ci.org/dobjs/dob-redux) [](https://www.npmjs.com/package/dob-redux) [](https://codecov.io/github/dobjs/dob-redux)
## Installation
```bash
npm i dob-redux
```
## Usage
```typescript
import { observable } from 'dob'
import { createReduxStore } from 'dob-redux'
import { Provider, connect } from "react-redux"
class User {
store = observable({
name: "nick",
age: 5,
articles: [{
title: "book1",
price: 59
}, {
title: "book2",
price: 63
}]
})
setName(name) {
this.store.name = name
}
addArticle(article) {
this.store.articles.push(article)
}
}
const { store, actions } = createReduxStore({
user: User
})
@connect((state, ownProps) => {
return {
name: state.user.name,
articles: state.user.articles
}
})
class App extends React.PureComponent {
componentWillMount() {
actions.user.addArticle({
title: "book3",
price: 66
})
}
render() {
const Articles = this.props.articles.map((article, index) => {
return (
{article.title}, {article.price}
)
})
return (
{this.props.name}
{Articles}
)
}
}
ReactDOM.render(
,
document.getElementById("react-dom")
)
```
## Online Demo
Here is a basic [demo](https://jsfiddle.net/56saqqvw/9/)
## Apis
### createReduxStore
Returns a store that can be used by Redux.
```typescript
import { createReduxStore } from 'dob-redux'
class Test {
store = observable({
age: 1
})
changeAge() {
this.store.age = 2
}
}
createReduxStore({
testStore: Test
})
```
### onSnapshot
```typescript
import { observable } from 'dob'
import { onSnapshot } from 'dob-redux'
const obj = observable({ a: 1 })
onSnapshot(obj, snapshot => {
// each time obj's any property changed, an new snapshot will created here
})
```