今天在项目中碰到点问题，记录一下。
导入的模型当中，场景里有很多面片都是相互克隆出来的，所以它们的材质都公用了，而我需要点击的那个面片让其重新赋予材质而又不影响其它的面片。
const intersects = this.raycaster.intersectObjects(this.selectObjects, true);
if (intersects.length > 0) {
console.log('intersects', intersects[0].object);
//获取所点击的模型
this.modelInfo = intersects[0].object;
if (this.modelInfo.isMesh) {
// 判断是否为上一次点击的内容
if (this.INTERSECTED != this.modelInfo) {
//将上一次点击的模型的材质复原
if (this.INTERSECTED) this.INTERSECTED.material = this.INTERSECTED.mat;
this.INTERSECTED = this.modelInfo;
// 存材质
this.INTERSECTED.mat = this.INTERSECTED.material;
// 改材质
this.INTERSECTED.material = new THREE.MeshStandardMaterial({
color: 0x00ffff,
transparent: true,
opacity: 0.7,
side: THREE.DoubleSide
})
} else {
// 重复拾取恢复默认颜色
if (this.INTERSECTED) {
this.INTERSECTED.material = this.INTERSECTED.mat;
}
this.INTERSECTED = null;
}
//点击到的模型派发事件给前端
this.signal.trigger('model', this.modelInfo)
}
} else {
this.signal.trigger('model', '')
}
INTERSECTED是全局声明的变量
this.INTERSECTED = null
上面我们把材质独立一份出来保存，然后再去进行操作。
