OBJLoader出现异步问题-等待XHR完成加载

Asynchronous issue with OBJLoader - wait for XHR to finish loading

本文关键字:XHR 加载 等待 异步 问题 OBJLoader      更新时间:2023-09-26

如何使OBJLoader简单地返回对象而不是将其添加到场景中?我遇到了一个同步问题,我的代码没有等待XHR请求完成,从而引发错误。

以下示例显示了问题:

var loader = new THREE.OBJLoader();
// return a mesh from an obj file   
function createObject( objFile, objName ) {
    object3d = loader.load( objFile , function ( object ) {
        object.name = objName;            
        console.log(object);
        return object;
    })
    return object3d;
}
car = createObject('path/to/car.obj', 'abc123');
car.position.y = 10;

这会在控制台中生成以下内容:

1. Uncaught TypeError: Cannot set property 'position' of undefined test.html:171
2. XHR finished loading: GET "path/to/car.obj". Three.js:11377
3. THREE.Object3D {id: 7, uuid: "9E8DC838-E68B-4FCA-A6AD-863D5D06D31F", name: "abc123", parent: undefined, children: Array[1]…}

因此,存在错误(1),因为"car.position.x"发生在XHR请求正在进行且对象为null的情况下。我的代码不会等待。但(2)和(3)表明,不久之后,加载请求确实成功完成。

你知道我该怎么做吗?如何让createObject()等待XHR请求完成后再继续?还是这通常只是一种糟糕的排序方式?

您可以在方法中创建一个"容器",并在加载后将对象添加到该容器中。

var loader = new THREE.OBJLoader();
// return a mesh from an obj file   
function createObject( objFile, objName ) {
    var container = new THREE.Object3D();
    loader.load( objFile , function ( object ) {
        object.name = objName;
        container.add( object );
    })
    return container;
}
car = createObject('path/to/car.obj', 'abc123');
car.position.y = 10;