用于附加/分离组件的aframe-state组件

Posted 2021-05-03

我试图根据某些条件将组件附加/分离到实体。

例如，我希望能够跟踪两个条件 -

1. 玩家点击了播放按钮
2. 倒计时时间尚未为零

在我将组件附加到实体之前。

我查看了Kevin - https://github.com/ngokevin/kframe/tree/master/components/state/的以下组件

其中有一个基于布尔值附加/分离组件的示例。以下是他的文档摘录

有一个bind-toggle组件，它将完全基于布尔值附加和分离组件。

<a-entity bind-toggle__raycastable="isRaycastable"></a-entity>

但是，在光线构件组件附加到实体之前，不清楚布尔值的设置位置。

我正在寻找一个解决方案，我可以按如下方式编写实体

<a-entity bind-toggle__move="condition1 && condition2"></a-entity>

当条件1（单击播放按钮）和条件2（时间倒计数不为零）满足时，组件“移动”附加到实体。我需要知道在哪里设置condition1和condition2的值。

如果你能为此提供一个可行的例子，那就太棒了。

我可以附加一个codepen，如果这样可以更容易理解。

答案

有两个事件：buttonclicked和countdownzero在相应的组件中发射到现场。

然后在州：

buttonclicked: function (state) {
  state.buttonClicked = true;
},

countdownzero: function (state) {
  state.countdownFinished = true;
}

然后可以做bind-toggle__move="buttonClicked && countdownFinished。如果您想要澄清，请告诉我！