https://github.com/gkshi/nuxt-models
JS model controller for your Nuxt.js project
https://github.com/gkshi/nuxt-models
data-validation entities models nuxt nuxtjs
Last synced: 8 months ago
JSON representation
JS model controller for your Nuxt.js project
- Host: GitHub
- URL: https://github.com/gkshi/nuxt-models
- Owner: gkshi
- License: other
- Created: 2019-12-18T21:19:30.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2021-04-30T15:49:26.000Z (almost 5 years ago)
- Last Synced: 2025-05-20T02:53:43.919Z (9 months ago)
- Topics: data-validation, entities, models, nuxt, nuxtjs
- Language: JavaScript
- Homepage:
- Size: 547 KB
- Stars: 4
- Watchers: 2
- Forks: 3
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# nuxt-models
> JS model controller for your Nuxt.js project.
Plugin use cases:
* Keep common data standart.
* Complement incomplete data getting by API.
* Control data validity.
### Installation
1. Install plugin via npm or yarn
```yarn add --dev nuxt-models```
2. Include plugin in nuxt.config.js
```javascript
export default {
plugins: [
'nuxt-models'
]
}
```
### Basic usage
1. Describe a model. Create /models/person.js
```javascript
export default {
name: String,
surname: String,
age: {
type: Number,
validation: value => value > 0
},
gender: {
type: String,
validation: value => ['male', 'female', 'other'].includes(value)
}
}
```
2. Create an entity in Vue-component
```javascript
const Person = this.$models.create('person', {
name: 'Jack',
age: 25
})
// returns an entity
// {
// name: 'Jack',
// surname: '',
// age: 25,
// gender: ''
// }
```
### Model describing
Model is an object with described options. There is a simple model example:
```javascript
// Simple person model with name only
export default {
name: {
type: String,
default: 'Jack',
required: true,
hidden: false,
validation: value => value.length > 1
}
}
```
`Option.type`
Defines an option type
String, Number, Array, Object, Boolean
`Option.default`
Default option value, when entity creates.
`Option.required`
True/false state. If it's true, Entity.validation will return false if there is no value.
`Option.hidden`
True/false state. If it's true, Entity.values method won't include this option to return.
`Option.validation`
A function. Describes condition for correct option value.
If all validation rules of options return true, Entity.validation returns true.
### Nested models
You may create entities with nested entities.
```javascript
import Department from '@/models/department'
// Person model
export default {
name: String,
age: Number,
department: {
model: Department,
value: 'title',
hidden: false
}
}
```
`Option.model`
Option with nested model.
`Option.value`
Option name of nested model. Entity.department will return its value.
Cannot be combined with "hidden" option.
`Option.hidden`
True/false state. If it's true, Entity.department will be added as hidden property.
Cannot be combined with "value" option.
### Plugin methods
`this.$models.create`
Creates an entity by described model
```javascript
const Person = this.$models.create('person', {
name: 'Jack',
age: 25
})
// returns an entity
// {
// name: 'Jack',
// surname: '',
// age: 25,
// gender: ''
// }
```
`this.$models.get`
Returns a model object
```javascript
const PersonModel = this.$models.get('person')
// returns a model
// {
// name: {
// type: String,
// required: true
// },
// surname: {
// type: String
// },
// age: {
// type: Number,
// validation: value => value >= 0,
// default: 0
// },
// gender: {
// type: String,
// validation: value => ['male', 'female', 'other'].includes(value)
// }
// }
```
`this.$models.clone`
Creates a copy of existing entity with all values
```javascript
const Person = this.$models.create('person', { name: 'Jack'} )
const AnotherPerson = this.$models.clone(Person)
console.log(Person.name) // Jack
console.log(AnotherPerson.name) // Jack
AnotherPerson.name = 'Mary'
console.log(Person.name) // Jack
console.log(AnotherPerson.name) // Mary
```
### Entity methods
`Entity.modelName`
Returns a model name, entity was created by
```javascript
const Person = this.$models.create('person')
console.log(Person.modelName) // person
```
`Entity.model`
Returns a model, entity was created by
```javascript
const Person = this.$models.create('person')
console.log(Person.model)
// returns a model
// {
// name: {
// type: String,
// required: true
// },
// surname: {
// type: String
// },
// age: {
// type: Number,
// validation: value => value >= 0,
// default: 0
// },
// gender: {
// type: String,
// validation: value => ['male', 'female', 'other'].includes(value)
// }
// }
```
`Entity.validation`
Returns true/false state.
If it's true, all entity values are correct.
If it's false, some of entity values hasn't passed validation.
Values without validation returns true in any case.
```javascript
const Person = this.$models.create('person')
console.log(Person.validation)
// return false
// because "gender" value hasn't passed validation
Person.gender = 'male'
console.log(Person.validation)
// return true
// all values have passed validation
```
`Entity.values`
Returns an object with all options and values.
Options with hidden property won't be included in object.