系统（System）

优质

小牛编辑

141浏览

2023-12-01

实体-组件-系统模式中的一个系统为组件类提供全局范围，服务和管理。它为组件类提供公共API（方法和属性）。一个系统可以通过场景元素来访问，并能帮助组件和全局场景交互。

例如，相机（camera）系统管理所有实体的camera组件，控制哪个摄像机是活动摄像机。

注册一个系统

系统注册类似于组件。

如果系统名称与组件名匹配，则组件将具有一个对系统的引用this.system：

AFRAME.registerSystem('my-component', {  schema: {},  // System schema. Parses into `this.data`.  init: function () {    // Called on scene initialization.  },  // Other handlers and methods.});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) {    // Do calculations and stuff with data.    return new ComplexObject(data);  }});AFRAME.registerComponent('my-component', {  init: function () {    this.myObject = null;  },  update: function () {    // Do stuff with `this.data`.    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);  }});