An open API service indexing awesome lists of open source software.

https://github.com/oknoorap/mobx-react-lite-context

Simple MobX React Lite with Context + Hooks
https://github.com/oknoorap/mobx-react-lite-context

mobx-react react

Last synced: 5 months ago
JSON representation

Simple MobX React Lite with Context + Hooks

Awesome Lists containing this project

README

          

MobX React Lite Context





Twitter: oknoorap

> Simple MobX React Lite with Context

## Install

```sh
# yarn
yarn add mobx mobx-react-lite mobx-react-lite-context

# npm
npm install mobx mobx-react-lite mobx-react-lite-context --save
```

## Example
More example via [codesandbox.io](https://codesandbox.io/s/mobx-react-lite-context-3iwcu)

```tsx
// index.tsx
import React from 'react'
import ReactDOM from 'react-dom'
import Page from './page'
import Store from './store'

const App = () => {
return (



);
};

ReactDOM.render(, document.getElementById("root"));

// page.tsx
import React from 'react'
import Store, { IStore } from './store'

export default () => {
const { counter }: IStore = useStore()

return (

counter.add()}>Increment {counter.value}

)
}

// store.ts
import { createContext } from "mobx-react-lite-context";
import Counter, { IStore as ICounterStore } from "./counter";

export interface IStore {
counter: ICounterStore;
}

export default createContext({
counter: new Counter()
});

// counter.ts
import { observable, action } from 'mobx'

interface IStore {
value: number;
add(): void;
}

export default class Store implements IStore {
@observable value = 0;
@action add() {
this.value++;
}
}
```

## 💰 Donate
Send me ETH to this address `0xab1c4e446900ad20bf5fae1be67f87d54dacd2f0`

## Author

👤 **Ribhararnus Pracutian <oknoorap@gmail.com>**

* Twitter: [@oknoorap](https://twitter.com/oknoorap)
* Github: [@oknoorap](https://github.com/oknoorap)

## 🤝 Contributing

Contributions, issues and feature requests are welcome!
Feel free to check [issues page](https://github.com/oknoorap/mobx-react-lite-context/issues).

## Show your support

Give a ⭐️ if this project helped you!

## License
MIT © oknoorap