Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/schorfes/pacto.model
A simple model/collection extension for pacto.
https://github.com/schorfes/pacto.model
Last synced: 11 days ago
JSON representation
A simple model/collection extension for pacto.
- Host: GitHub
- URL: https://github.com/schorfes/pacto.model
- Owner: schorfES
- License: mit
- Created: 2018-05-29T13:21:00.000Z (over 6 years ago)
- Default Branch: main
- Last Pushed: 2024-10-01T16:20:35.000Z (about 1 month ago)
- Last Synced: 2024-10-17T21:30:29.286Z (21 days ago)
- Language: JavaScript
- Homepage:
- Size: 4.44 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Pacto.Model
[](https://github.com/schorfES/pacto.model/actions)
[](https://codecov.io/gh/schorfES/pacto.model)
[](https://snyk.io/test/github/schorfES/pacto.model)
A simple model/collection extension for [pacto](https://github.com/schorfES/pacto).
- [Installation](#installation)
- [Requirements](#requirements)
- [Documentation](#documentation)
- [Model](#model)
- [Collection](#collection)
- [License](#license)
## Installation
Pacto.Model is available on [NPM](https://www.npmjs.com/package/pacto.model):
```bash
npm install pacto pacto.model --save
```
## Requirements
Pacto.Model only depends on Pacto which is _dependency free_, but it requires
latest browser features. For [Collection](#collection) or [Model](#model) you
may need a polyfill for [Proxy](https://www.npmjs.com/package/proxy-polyfill).
## Documentation
### Model
A model is an observed object. It detects changes to its properties and
dispatches a `'change'` event. All properties of a model instance are accessible
through the `.props` property.
```javascript
import {Model} from 'pacto.model';
const data = {foo: 'bar'};
const model = new Model(data);
model.on('change', () => console.log(model.props)); // logs: {foo: 'baz'}
model.props.foo = 'baz';
```
A model can be created using defaults for its properties. If one or more of
these properties are not passed into the model, the model will use the
predefined default values until the value will be set.
```javascript
import {Model} from 'pacto.model';
class MyModel extends Model {
get defaults() {
return {foo: 'foo', baz: 'baz'};
}
}
const data = {foo: 'bar'};
const model = new MyModel(data);
console.log(model.props); // logs: {foo: 'bar', baz: 'baz'}
```
### Collection
A collection is an observed array of [Models](#model). These models are
accessible through the `.models` property. This property offers all
[array functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array).
When one of these functions changes the array, the collection instance
dispatches a `'change'` event.
All items which are passed into the collection will be transformed into a
[Model](#model). Which type of Model should be used is defined in the `.Model`
getter of a Collection instance.
```javascript
import {Collection, Model} from 'pacto.model';
class MyModel extends Model {
get defaults() {
return {foo: 'foo', baz: 'baz'};
}
}
class MyCollection extends Collection {
get Model() {
return MyModel;
}
}
const collection = new MyCollection([{foo: 'bar'}]);
collection.on('change', () => console.log(collection.models)); // logs: [{foo: 'bar', baz: 'baz'}, {foo: 'foo', baz: 'bar'}]
collection.models.push({baz: 'bar'});
```
## License
[LICENSE (MIT)](./LICENSE)