三.js/反应三纤维：属性 X 在 Object3D <Event>类型上不存在

Question

我正在使用 ReactThree Fiber和TypeScript来键入我的 React App。我有以下代码：

return (
<group ref={group} dispose={null}>
<scene name="Scene" {...props}>
<mesh
ref={mesh}
scale={1.5}
name="Object_0"
morphTargetDictionary={nodes.Object_0.morphTargetDictionary}
morphTargetInfluences={nodes.Object_0.morphTargetInfluences}
rotation={[Math.PI / 2, 0, 0]}
geometry={nodes.Object_0.geometry}
material={materials.Material_0_COLOR_0}
/>
</scene>
</group>
);

但是我一直有同样的错误：Property: 'morphTargetDictionary' does not exist on type 'Object3D<Event>，变形目标影响和几何也会发生同样的情况。

我尝试执行以下操作，因为我知道我需要将这些属性包含在Object3D的声明中(我使用的是 npm 包@types/three)，但没有结果。

declare module '@types/three' {
export default interface Object3D {
morphTargetDictionary: number;
morphTargetInfluences: number
geometry: string
}
}

提前感谢！

Answer 1

最后我找到了解决方案，您需要使用断言来告诉 Typescript 您正在使用的值的类型：

return (
<group ref={group} dispose={null}>
<scene name="Scene" {...props}>
<mesh
ref={mesh}
scale={1.5}
name="Object_0"
morphTargetDictionary={(nodes.Object_0 as THREE.Mesh).morphTargetDictionary}
morphTargetInfluences={(nodes.Object_0 as THREE.Mesh).morphTargetInfluences}
rotation={[Math.PI / 2, 0, 0]}
geometry={(nodes.Object_0 as THREE.Mesh).geometry}
material={materials.Material_0_COLOR_0}
/>
</scene>
</group>
);

这是因为THREE.Mesh从Object3D扩展而来，是一个具有morphTargetDictionary作为类属性的类。