如何从useFBX渲染多个模型？@react-three/drei

import { useLoader } from "@react-three/fiber";
import { FBXLoader } from "three/examples/jsm/loaders/FBXLoader";

const models = [
  { url: "model1.fbx", position: [0, 0, 0] },
  { url: "model2.fbx", position: [2, 0, 0] },
  // 添加更多模型...
];

const ModelLoader = () => {
  const modelsLoaded = models.map((model) => {
    const fbx = useLoader(FBXLoader, model.url);
    return <primitive object={fbx} position={model.position} />;
  });

  return <>{modelsLoaded}</>;
};

import { Canvas } from "@react-three/fiber";

const App = () => {
  return (
    <Canvas>
      <ambientLight />
      <pointLight position={[10, 10, 10]} />
      <ModelLoader />
    </Canvas>
  );
};