aframe Components Defining compnent schema object


Example

The schema is an object that defines and describes the property or properties of the component. The schema’s keys are the names of the property, and the schema’s values define the types and values of the property (in case of a multi-property component):

Defining schema in your component

AFRAME.registerComponent('bar', {
  schema: {
    color: {default: '#FFF'},
    size: {type: 'int', default: 5}
  }
}

Override defined schema defaults

<a-scene>
  <a-entity bar="color: red; size: 20"></a-entity>
</a-scene>

Single-Property Schema

A component can either be a single-property component (consisting of one anonymous value) or a multi-property component (consisting of multiple named values). A-Frame will infer whether a component is single-property vs. multi-property based on the structure of the schema.

A single-property component's schema contains type and/or default keys, and the schema's values are plain values rather than objects:

AFRAME.registerComponent('foo', {
  schema: {type: 'int', default: 5}
});
<a-scene>
  <a-entity foo="20"></a-entity>
</a-scene>