vue使用3d模型"vue3dLoader"

如果你在vue2中使用vue-3d-model出错

不放来试试这种方式vue3dLoader

开始进入

1.npm下载

/* vue2 */:
npm i vue-3d-loader@1.x.x -S

/* vue3 */:
npm i vue-3d-loader@2.0.0 -S

2.引入

/* vue2 */
import vue3dLoader from "vue-3d-loader";
Vue.use(vue3dLoader)

/* vue3 */
import vue3dLoader from "vue-3d-loader";
createApp(App).use(vue3dLoader).mount('#app')

import { vue3dLoader } from "vue-3d-loader"; 
components: {
   vue3dLoader
  },

3.使用标签

<vue3dLoader
     :filePath="['/static/glft/scene(39).gltf',]"
      :width="400"
       :height="200"
       
       :mtlPath="[null, ]"
  :backgroundColor="back"
       ></vue3dLoader>

4.事件

5.支持多个模型

<!-- 可同时加载多个不同种类的模型 -->
 <vue3dLoader
     :filePath="['/static/glft/scene(39).gltf','/static/007 - Squirtle/Squirtle.obj']"
      :width="400"
       :height="200"
       :scale="{ x: 5, y: 5, z: 5 }"
       :cameraPosition="{ x: 150, y: 150, z: 150 }"
       :mtlPath="[null,  null]"
  :backgroundColor="back"
       ></vue3dLoader>