系统(System)
实体-组件-系统模式中的一个系统为组件类提供全局范围,服务和管理。它为组件类提供公共API(方法和属性)。一个系统可以通过场景元素来访问,并能帮助组件和全局场景交互。
例如,相机(camera)系统管理所有实体的camera组件,控制哪个摄像机是活动摄像机。
注册一个系统
系统注册类似于组件。
如果系统名称与组件名匹配,则组件将具有一个对系统的引用this.system
:
AFRAME.registerSystem('my-component', { schema: {}, init: function () { }, }); AFRAME.registerComponent('my-component', { init: function () { console.log(this.system); } });
|
属性
属性 |
描述 |
schema |
和组件模式表现一样。解析为data 。 |
data |
模式中通过处理器和方法提供的数据。 |
Methods
系统和组件一样定义了生命周期处理器。它也可以定义希望成为公共API的方法。
方法 |
描述 |
init |
初始化系统时调用一次。用于初始化。 |
pause |
场景暂停时调用。用于停止动态行为。 |
play |
场景启动或恢复时调用。用于启动动态行为。 |
tick |
如果被定义,将在场景渲染循环的每一瞬间调用。 |
访问一个系统
可以通过场景访问实例化的系统:
document.querySelector('a-scene').systems[systemName];
|
注册的系统原型可以通过 AFRAME.systems
来访问。
Patterns
逻辑与数据分离
如果需要,系统可以帮助将逻辑和行为与数据分开。我们让系统处理繁重的工作,而组件只需要操心通过其生命周期方法管理数据:
AFRAME.registerSystem('my-component', { createComplexObject: function (data) { return new ComplexObject(data); } }); AFRAME.registerComponent('my-component', { init: function () { this.myObject = null; }, update: function () { this.myObject = this.system.createComplexObject(data); } });
|
管理系统所有组件
没有严格的API定义系统如何管理组件。一个常见的模式是让组件订阅系统。然后系统对其所有组件都有引用:
AFRAME.registerSystem('my-component', { init: function () { this.entities = []; }, registerMe: function (el) { this.entities.push(el); }, unregisterMe: function (el) { var index = this.entities.indexOf(el); this.entities.splice(index, 1); } }); AFRAME.registerComponent('my-component', { init: function () { this.system.registerMe(this.el); }, remove: function () { this.system.unregisterMe(this.el); } });
|