在vue2下使用three.js如何循环le boj1 = new OBJLoader();,如何将这个方法封装起来,然后有模型的时候就直接引用这个方法,他的代码是什么
时间: 2023-04-05 07:02:12 浏览: 139
在vue中封装方法以及多处引用该方法详解
5星 · 资源好评率100%
你可以使用一个循环来加载多个模型,代码如下:
```
const loader = new THREE.OBJLoader();
const models = [
{ name: 'model1', url: 'model1.obj' },
{ name: 'model2', url: 'model2.obj' },
{ name: 'model3', url: 'model3.obj' }
];
const loadModels = () => {
models.forEach(model => {
loader.load(model.url, obj => {
obj.name = model.name;
scene.add(obj);
});
});
};
loadModels();
```
你可以将这个方法封装起来,代码如下:
```
const loadModels = (models, loader, scene) => {
models.forEach(model => {
loader.load(model.url, obj => {
obj.name = model.name;
scene.add(obj);
});
});
};
const models = [
{ name: 'model1', url: 'model1.obj' },
{ name: 'model2', url: 'model2.obj' },
{ name: 'model3', url: 'model3.obj' }
];
const loader = new THREE.OBJLoader();
const scene = new THREE.Scene();
loadModels(models, loader, scene);
```
当你有模型的时候,你可以直接引用这个方法,代码如下:
```
const models = [
{ name: 'model1', url: 'model1.obj' },
{ name: 'model2', url: 'model2.obj' },
{ name: 'model3', url: 'model3.obj' }
];
const loader = new THREE.OBJLoader();
const scene = new THREE.Scene();
loadModels(models, loader, scene);
```
阅读全文