javascript - aframe 错误 : Entity. setObject3D 调用的对象不是 THREE.Object3D 的实例

Question

你好，我尝试向我的 aframe 组件添加网格，但是我收到一个奇怪的错误，并且使用了这样一个非常简单的代码

AFRAME.registerComponent('mysquare', {
      init: function(){
        var el = this.el; 

        var box = new THREE.BoxGeometry(40, 5, 40);
        var boxMesh = new THREE.Mesh(box);
        boxMesh.position.set(25, 0, 25);
        el.setObject3D("mesh", boxMesh);

      }
    });

home.html

<ion-content>
      <div></div>
      <a-scene embedded>
         <a-entity mysquare></a-entity>
       </a-scene> 
</ion-content>

错误信息

Error: Entity.setObject3D was called with an object that was not an instance of THREE.Object3D.

我也尝试了add功能，但我收到了相同的消息。怎么可能？

我使用 ionic 2 + aframe v.0.7.1 开发我的应用程序。我也尝试过 0.5.0 版本，但我有同样的问题

Answer 1

最后我解决了这个问题，没有直接包含 Threejs 库。

我的导入部分是这样的

import * as THREE from 'three';
declare var AFRAME;

我已经删除了第一个导入，现在一切正常了。现在我可以在这种模式下创建一个 3D 对象

el.setObject3D("mesh", new AFRAME.THREE.Object3D());