https://github.com/mintsweet/mst-advanced

⚙️ advanced model for mst
https://github.com/mintsweet/mst-advanced

Last synced: 6 days ago
JSON representation

⚙️ advanced model for mst

• Host: GitHub
• URL: https://github.com/mintsweet/mst-advanced
• Owner: mintsweet
• License: mit
• Created: 2022-03-30T08:35:28.000Z (over 2 years ago)
• Default Branch: master
• Last Pushed: 2022-11-02T12:38:22.000Z (about 2 years ago)
• Last Synced: 2024-10-31T04:09:17.717Z (about 2 months ago)
• Language: TypeScript
• Homepage:
• Size: 1.32 MB
• Stars: 1
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# mst-advanced

> advanced model for mst

## Installation

```

$ yarn add react react-dom mobx mobx-state-tree lodash

$ yarn add mst-advanced

```

## Usage

### Create Query Model

```javascript

import { types } from 'mobx-state-tree';

import { createQueryModel } from 'mst-advanced';

export const Store = createQueryModel({

  Model: types.model({

    name: types.maybeNull(types.string);

  }),

  onQuery: (signal) => apiCall('/xxx/xxx', { signal }),

  onResult: (t, res) => {

    t.data = res;

  },

});

```

### Create List Model

```javascript

import { types } from 'mobx-state-tree';

import { createListModel } from 'mst-advanced';

const Item = types.model({

  name: types.string;

});

export const Store = createListModel({

  Item,

  onQuery: (signal, params) => apiCall('/xxx/xxx', { signal, params }),

  onResult: (i:) => ({

    name: i.name,

  }),

});

```

### Use in react page

```javascript

import { observer } from 'mobx-react-lite';

import { useQuery } from 'mst-advanced';

import { Store } from '../models'; // query model or list model

export default function Page() {

  const { loading, error, data } = useQuery(Model1Store, { page: 1, pageSize: 10 });

  if (loading) {

    return 
Loading...
;

  }


  if (error) {

    return 
Something Error.
;

  }


  return 
page
;

}

```


## License

MIT