自学内容网 自学内容网

vue与u3d互调

vue与u3d互调

u3d配置

给前端发送数据的方法中使用下面的方法给Window注册个事件

//  eventname 方法名: 随意取, 前端用这个名判断是获取哪个事件的数据
//  data 给vue 传递的参数
window.ReportReady(UTF8ToString(eventname), UTF8ToString(data));

vue配置

  • 将u3d导出好的文件放到/public/u3d
Build
  - testwebgl.data.unityweb
  - testwebgl.framework.js.unityweb
  - testwebgl.loader.js
  - testwebgl.wasm.unityweb
StreamingAssets
TemplateData
index.html
  • 安装
npm i unity-webgl@3.5.5 --save
  • 组件
<template>
<VueUnity :unity="unityContext" width="100%" height="100%" id="unityCanvas"></VueUnity>
    <el-button type="primary"  @click="handleSendTo">向u3d发送数据</el-button>
</template>

<script>
import UnityWebgl from "unity-webgl";
import VueUnity from "unity-webgl/vue";
export default {
components: {
VueUnity,
},
data() {
return {
unityContext: null,
};
},
mounted() {
this.initUnity();

        // 监听事件
window.ReportReady = function (eventname, data) {
console.log("u3d发送来的>>>>", eventname, data);
if (eventname == "getHeightEvent") {
...
}
};
},
methods: {
        handleSendTo(){
            this.unityContext.send("changeHeight", "height", 100);
        },
initUnity() {
this.unityContext = new UnityWebgl(document.getElementById("unityCanvas"), {
loaderUrl:"/u3d/Build/testwebgl.loader.js",
dataUrl: "/u3d/Build/testwebgl.data.unityweb",
frameworkUrl:"/u3d/Build/testwebgl.framework.js.unityweb",
codeUrl:  "/u3d/Build/testwebgl.wasm.unityweb",
});
},
},
};
</script>


原文地址:https://blog.csdn.net/zhao3756/article/details/143059613

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!