项目需求:需要在场景加载完成后更新场景中stl模型文件
//在threejs里,是将模型文件赋给mesh的geometry
mesh.geometry.dispose(); // 释放旧几何体的内存
mesh.geometry = newGeometry; // 更新网格的几何体
//我这里用的是tresjs
<template>
<TresMesh ref="targetMesh" :geometry="geometry" :material="material" />
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { STLLoader } from 'three/addons/loaders/STLLoader'
import { useLoader } from '@tresjs/core'
import * as THREE from 'three'
const targetMesh = ref(null)
geometry = await useLoader(STLLoader, '1.stl')
onMounted(async () => {
// 设置定时器5S后切换模型
setTimeout(async () => {
targetMesh.value.geometry.dispose()
targetMesh.value.geometry = await useLoader(
STLLoader,
'2.stl)',
)
}, 5000)
})
// 定义材质
const material = new THREE.MeshStandardMaterial({
color: 0xffffff,
roughness: 0.2,
metalness: 1,
vertexColors: true
})
</script>