new Component(opts)
The base class from which all JSData components inherit some basic functionality.
Typically you won't instantiate this class directly, but you may find it useful as an abstract class for your own components.
See Component.extend for an example of using Component as a base class.
import {Component} from 'js-data'
Name | Type | Argument | Description | ||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
opts |
Object |
<optional> |
Configuration options. Properties
|
Since | Source |
---|---|
3.0.0 | node_modules/js-data/src/Component.js, line 4 |
Members
-
_listeners
-
Event listeners attached to this Component. Do not modify. Use Component#on and Component#off instead.
DetailsType Since Source Object 3.0.0 node_modules/js-data/src/Component.js, line 52 -
debug
-
Whether to enable debug-level logs for this component. Anything that extends
Component
inherits this option and the corresponding logging functionality.DetailsType Since Default value Source Boolean 3.0.0 false
node_modules/js-data/src/Component.js, line 28 Example// Normally you would do: import {Component} from 'js-data' const JSData = require('js-data@3.0.0-beta.10') const {Component} = JSData console.log('Using JSData v' + JSData.version.full) const component = new Component() component.log('debug', 'some message') // nothing gets logged // Display debug logs: component.debug = true component.log('debug', 'other message') // this DOES get logged
Methods
-
<static> extend(props, classProps)
-
Create a subclass of this Component:
Method parameters:Name Type Argument Default Description props
Object <optional>
{} Properties to add to the prototype of the subclass.
Properties
Name Type Argument Description constructor
Object <optional>
Provide a custom constructor function to be used as the subclass itself.
classProps
Object <optional>
{} Static properties to add to the subclass.
Return value:Type Description Constructor Subclass of this Component class.
DetailsSince Source 3.0.0 node_modules/js-data/src/Component.js, line 68 Example// Normally you would do: import {Component} from 'js-data' const JSData = require('js-data@3.0.0-beta.10') const {Component} = JSData console.log('Using JSData v' + JSData.version.full) // Extend the class using ES2015 class syntax. class CustomComponentClass extends Component { foo () { return 'bar' } static beep () { return 'boop' } } const customComponent = new CustomComponentClass() console.log(customComponent.foo()) console.log(CustomComponentClass.beep()) // Extend the class using alternate method. const OtherComponentClass = Component.extend({ foo () { return 'bar' } }, { beep () { return 'boop' } }) const otherComponent = new OtherComponentClass() console.log(otherComponent.foo()) console.log(OtherComponentClass.beep()) // Extend the class, providing a custom constructor. function AnotherComponentClass () { Component.call(this) this.created_at = new Date().getTime() } Component.extend({ constructor: AnotherComponentClass, foo () { return 'bar' } }, { beep () { return 'boop' } }) const anotherComponent = new AnotherComponentClass() console.log(anotherComponent.created_at) console.log(anotherComponent.foo()) console.log(AnotherComponentClass.beep())
-
dbg(args)
-
Log the provided values at the "debug" level. Debug-level logs are only logged if Component#debug is
true
..dbg(...)
is shorthand for.log('debug', ...)
.Method parameters:Name Type Argument Description args
* <optional>
<repeatable>
Values to log.
DetailsSince Source 3.0.0 node_modules/js-data/src/Component.js, line 123 -
emit(event, args)
-
Trigger an event on this Component.
Method parameters:Name Type Argument Description event
String Name of event to emit.
args
* <optional>
<repeatable>
Arguments to pass to any listeners.
DetailsSince Source 3.0.0 node_modules/js-data/src/Component.js, line 201 Example// import {Collection, DataStore} from 'js-data' const JSData = require('js-data@3.0.0-beta.10') const {Collection, DataStore} = JSData const collection = new Collection() collection.on('foo', function (msg) { console.log(msg) }) collection.emit('foo', 'bar') const store = new DataStore() store.on('beep', function (msg) { console.log(msg) }) store.emit('beep', 'boop')
-
log(level, args)
-
Log the provided values. By default sends values to
console[level]
. Debug-level logs are only logged if Component#debug istrue
.Will attempt to use appropriate
console
methods if they are available.Method parameters:Name Type Argument Description level
String Log level.
args
* <optional>
<repeatable>
Values to log.
DetailsSince Source 3.0.0 node_modules/js-data/src/Component.js, line 133 -
off(event, listener)
-
Remove an event listener from this Component. If no listener is provided, then all listeners for the specified event will be removed. If no event is specified then all listeners for all events will be removed.
Method parameters:Name Type Argument Description event
String <optional>
Name of event to unsubsribe to.
listener
Function <optional>
Listener to remove.
DetailsSince Source 3.0.0 node_modules/js-data/src/Component.js, line 179 Examples// Remove a particular listener for a particular event collection.off('add', handler)
// Remove all listeners for a particular event record.off('change')
// Remove all listeners to all events store.off()
-
on(event, listener, ctx)
-
Register a new event listener on this Component.
Method parameters:Name Type Argument Description event
String Name of event to subsribe to.
listener
Function Listener function to handle the event.
ctx
* <optional>
Optional content in which to invoke the listener.
DetailsSince Source 3.0.0 node_modules/js-data/src/Component.js, line 146 Examples// Listen for all "afterCreate" events in a DataStore store.on('afterCreate', (mapperName, props, opts, result) => { console.log(mapperName) // "post" console.log(props.id) // undefined console.log(result.id) // 1234 }) store.create('post', { title: 'Modeling your data' }).then((post) => { console.log(post.id) // 1234 })
// Listen for the "add" event on a collection collection.on('add', (records) => { console.log(records) // [...] })
// Listen for "change" events on a record post.on('change', (record, changes) => { console.log(changes) // { changed: { title: 'Modeling your data' } } }) post.title = 'Modeling your data'